fix: do not redirect third party css file (#1069)

Co-authored-by: Wei <[email protected]>

Author: Timeless0911

packages/core/src/css/cssConfig.ts

@@ -98,10 +98,11 @@ export async function cssExternalHandler(
   let resolvedRequest = request;
 
   if (styleRedirectPath) {
-    const resolved = await redirectPath(resolvedRequest);
-    if (resolved) {
-      resolvedRequest = resolved;
+    const redirectedPath = await redirectPath(resolvedRequest);
+    if (redirectedPath === undefined) {
+      return callback(undefined, request);
     }
+    resolvedRequest = redirectedPath;
   }
 
   if (!isCssFile(resolvedRequest)) {

pnpm-lock.yaml

@@ -21,11 +21,12 @@ test('redirect.js default', async () => {
 
   expect(indexContent).toMatchInlineSnapshot(`
     "import lodash from "lodash";
+    import lodash_merge from "lodash.merge";
     import prettier from "prettier";
     import { bar } from "./bar/index.js";
     import { foo } from "./foo.js";
     import { baz } from "./baz.js";
-    const src = lodash.toUpper(foo + bar + foo + bar + baz + typeof prettier.version);
+    const src = lodash.toUpper(lodash_merge(foo) + bar + foo + bar + baz + typeof prettier.version);
     export { src as default };
     "
   `);
@@ -45,13 +46,14 @@ test('redirect.js.path false', async () => {
 
   expect(indexContent).toMatchInlineSnapshot(`
     "import lodash from "lodash";
+    import lodash_merge from "lodash.merge";
     import prettier from "prettier";
     import { bar } from "@/bar";
     import { foo } from "@/foo";
     import { baz } from "~/baz";
     import { bar as external_bar_js_bar } from "./bar.js";
     import { foo as external_foo_js_foo } from "./foo.js";
-    const src = lodash.toUpper(external_foo_js_foo + external_bar_js_bar + foo + bar + baz + typeof prettier.version);
+    const src = lodash.toUpper(lodash_merge(external_foo_js_foo) + external_bar_js_bar + foo + bar + baz + typeof prettier.version);
     export { src as default };
     "
   `);
@@ -69,13 +71,14 @@ test('redirect.js.path with user override externals', async () => {
 
   expect(indexContent).toMatchInlineSnapshot(`
     "import lodash from "lodash";
+    import lodash_merge from "lodash.merge";
     import prettier from "prettier";
     import { bar } from "./others/bar/index.js";
     import { foo } from "./others/foo.js";
     import { baz } from "./baz.js";
     import { bar as index_js_bar } from "./bar/index.js";
     import { foo as external_foo_js_foo } from "./foo.js";
-    const src = lodash.toUpper(external_foo_js_foo + index_js_bar + foo + bar + baz + typeof prettier.version);
+    const src = lodash.toUpper(lodash_merge(external_foo_js_foo) + index_js_bar + foo + bar + baz + typeof prettier.version);
     export { src as default };
     "
   `);
@@ -101,13 +104,14 @@ test('redirect.js.path with user override alias', async () => {
 
   expect(indexContent).toMatchInlineSnapshot(`
     "import lodash from "lodash";
+    import lodash_merge from "lodash.merge";
     import prettier from "prettier";
     import { bar } from "./others/bar/index.js";
     import { foo } from "./others/foo.js";
     import { baz } from "./baz.js";
     import { bar as index_js_bar } from "./bar/index.js";
     import { foo as external_foo_js_foo } from "./foo.js";
-    const src = lodash.toUpper(external_foo_js_foo + index_js_bar + foo + bar + baz + typeof prettier.version);
+    const src = lodash.toUpper(lodash_merge(external_foo_js_foo) + index_js_bar + foo + bar + baz + typeof prettier.version);
     export { src as default };
     "
   `);
@@ -128,11 +132,12 @@ test('redirect.js.extension: false', async () => {
   );
   expect(indexContent).toMatchInlineSnapshot(`
     "import lodash from "lodash";
+    import lodash_merge from "lodash.merge";
     import prettier from "prettier";
     import { bar } from "./bar/index.ts";
     import { foo } from "./foo.ts";
     import { baz } from "./baz.ts";
-    const src = lodash.toUpper(foo + bar + foo + bar + baz + typeof prettier.version);
+    const src = lodash.toUpper(lodash_merge(foo) + bar + foo + bar + baz + typeof prettier.version);
     export { src as default };
     "
   `);

tests/integration/redirect/js.test.ts

@@ -5,9 +5,8 @@
   "type": "module",
   "devDependencies": {
     "@types/lodash": "^4.17.17",
-    "lodash": "^4.17.21"
-  },
-  "peerDependencies": {
-    "lodash": "^4.17.21"
+    "@types/lodash.merge": "^4.6.9",
+    "lodash": "^4.17.21",
+    "lodash.merge": "^4.6.2"
   }
 }

tests/integration/redirect/js/package.json

@@ -1,14 +1,17 @@
 // can not be resolved
 import lodash from 'lodash';
+// can be resolved, 3rd party packages
+import merge from 'lodash.merge';
 // can be resolved but not specified -- phantom dependency
 import prettier from 'prettier';
 
 import { bar as bar2 } from '@/bar';
 import { foo as foo2 } from '@/foo';
+// @ts-expect-error test case for unresolved paths import
 import { baz } from '~/baz';
 import { bar } from './bar';
 import { foo } from './foo';
 
 export default lodash.toUpper(
-  foo + bar + foo2 + bar2 + baz + typeof prettier.version,
+  merge(foo) + bar + foo2 + bar2 + baz + typeof prettier.version,
 );

tests/integration/redirect/js/src/index.ts

@@ -159,10 +159,12 @@ test('should external 3rd packages CSS', async () => {
   expect(pkgIndexJs).toMatchInlineSnapshot(`
     "import "element-ui/lib/theme-chunk/index.css";
     import "element-ui/lib/theme-chunk/index";
+    import "third-party/index.module.scss";
     "
   `);
   expect(pkgIndexCjs).toContain(
     `require("element-ui/lib/theme-chunk/index.css");
-require("element-ui/lib/theme-chunk/index");`,
+require("element-ui/lib/theme-chunk/index");
+require("third-party/index.module.scss");`,
   );
 });

tests/integration/redirect/style.test.ts

@@ -0,0 +1 @@
+!node_modules/

tests/integration/redirect/style/.gitignore

@@ -1,3 +1,5 @@
 // https://github.com/web-infra-dev/rslib/issues/617
 import 'element-ui/lib/theme-chunk/index.css';
 import 'element-ui/lib/theme-chunk/index';
+// can be resolved, 3rd party packages
+import 'third-party/index.module.scss';