fix: ensure postcss-loader uses the built-in postcss (#3204)

web-infra-dev · Aug 14, 2024 · f8fa16d · f8fa16d
1 parent 462ccdf
commit f8fa16d
Show file tree

Hide file tree

Showing 12 changed files with 41 additions and 32 deletions.
diff --git a/packages/compat/webpack/tests/__snapshots__/default.test.ts.snap b/packages/compat/webpack/tests/__snapshots__/default.test.ts.snap
@@ -54,7 +54,7 @@ exports[`applyDefaultPlugins > should apply default plugins correctly 1`] = `
             "loader": "<ROOT>/node_modules/<PNPM_INNER>/mini-css-extract-plugin/dist/loader.js",
           },
           {
-            "loader": "<ROOT>/packages/core/compiled/css-loader",
+            "loader": "<ROOT>/packages/core/compiled/css-loader/index.js",
             "options": {
               "importLoaders": 0,
               "modules": {
@@ -421,7 +421,7 @@ exports[`applyDefaultPlugins > should apply default plugins correctly when produ
             "loader": "<ROOT>/node_modules/<PNPM_INNER>/mini-css-extract-plugin/dist/loader.js",
           },
           {
-            "loader": "<ROOT>/packages/core/compiled/css-loader",
+            "loader": "<ROOT>/packages/core/compiled/css-loader/index.js",
             "options": {
               "importLoaders": 0,
               "modules": {
@@ -784,7 +784,7 @@ exports[`applyDefaultPlugins > should apply default plugins correctly when targe
             "loader": "<ROOT>/packages/core/dist/ignoreCssLoader.cjs",
           },
           {
-            "loader": "<ROOT>/packages/core/compiled/css-loader",
+            "loader": "<ROOT>/packages/core/compiled/css-loader/index.js",
             "options": {
               "importLoaders": 0,
               "modules": {
@@ -1089,7 +1089,7 @@ exports[`applyDefaultPlugins > should apply default plugins correctly when targe
             "loader": "<ROOT>/packages/core/dist/ignoreCssLoader.cjs",
           },
           {
-            "loader": "<ROOT>/packages/core/compiled/css-loader",
+            "loader": "<ROOT>/packages/core/compiled/css-loader/index.js",
             "options": {
               "importLoaders": 0,
               "modules": {

diff --git a/packages/core/prebundle.config.mjs b/packages/core/prebundle.config.mjs
@@ -158,11 +158,16 @@ export default {
         );
       },
     },
+    {
+      name: 'postcss',
+      ignoreDts: true,
+    },
     {
       name: 'css-loader',
       ignoreDts: true,
       externals: {
         semver: './semver',
+        postcss: '../postcss',
         picocolors: '../picocolors',
       },
       afterBundle: writeEmptySemver,
@@ -172,6 +177,7 @@ export default {
       externals: {
         jiti: '../jiti',
         semver: './semver',
+        postcss: '../postcss',
       },
       ignoreDts: true,
       beforeBundle(task) {

diff --git a/packages/core/src/helpers/path.ts b/packages/core/src/helpers/path.ts
@@ -27,7 +27,7 @@ export function getCommonParentPath(paths: string[]): string {
 }
 
 export const getCompiledPath = (packageName: string): string =>
-  join(COMPILED_PATH, packageName);
+  join(COMPILED_PATH, packageName, 'index.js');
 
 /**
  * ensure absolute file path.

diff --git a/packages/core/src/plugins/css.ts b/packages/core/src/plugins/css.ts
@@ -131,6 +131,7 @@ const getPostcssLoaderOptions = async ({
   userPostcssConfig.plugins ||= [];
 
   const defaultPostcssConfig: PostCSSLoaderOptions = {
+    implementation: getCompiledPath('postcss'),
     postcssOptions: userPostcssConfig,
     sourceMap: config.output.sourceMap.css,
   };

diff --git a/packages/core/tests/__snapshots__/builder.test.ts.snap b/packages/core/tests/__snapshots__/builder.test.ts.snap
@@ -41,7 +41,7 @@ exports[`should use rspack as default bundler > apply rspack correctly 1`] = `
             "loader": "<ROOT>/node_modules/<PNPM_INNER>/@rspack/core/dist/builtin-plugin/css-extract/loader.js",
           },
           {
-            "loader": "<ROOT>/packages/core/compiled/css-loader",
+            "loader": "<ROOT>/packages/core/compiled/css-loader/index.js",
             "options": {
               "importLoaders": 1,
               "modules": {

diff --git a/packages/core/tests/__snapshots__/css.test.ts.snap b/packages/core/tests/__snapshots__/css.test.ts.snap
@@ -16,7 +16,7 @@ exports[`plugin-css > should use custom cssModules rule when using output.cssMod
             "loader": "<ROOT>/node_modules/<PNPM_INNER>/@rspack/core/dist/builtin-plugin/css-extract/loader.js",
           },
           {
-            "loader": "<ROOT>/packages/core/compiled/css-loader",
+            "loader": "<ROOT>/packages/core/compiled/css-loader/index.js",
             "options": {
               "importLoaders": 1,
               "modules": {
@@ -66,7 +66,7 @@ exports[`plugin-css injectStyles > should apply ignoreCssLoader when injectStyle
             "loader": "<ROOT>/packages/core/src/ignoreCssLoader.cjs",
           },
           {
-            "loader": "<ROOT>/packages/core/compiled/css-loader",
+            "loader": "<ROOT>/packages/core/compiled/css-loader/index.js",
             "options": {
               "importLoaders": 0,
               "modules": {
@@ -103,10 +103,10 @@ exports[`plugin-css injectStyles > should use css-loader + style-loader when inj
         "type": "javascript/auto",
         "use": [
           {
-            "loader": "<ROOT>/packages/core/compiled/style-loader",
+            "loader": "<ROOT>/packages/core/compiled/style-loader/index.js",
           },
           {
-            "loader": "<ROOT>/packages/core/compiled/css-loader",
+            "loader": "<ROOT>/packages/core/compiled/css-loader/index.js",
             "options": {
               "importLoaders": 1,
               "modules": {
@@ -154,7 +154,7 @@ exports[`should ensure isolation of PostCSS config objects between different bui
         "loader": "<ROOT>/node_modules/<PNPM_INNER>/@rspack/core/dist/builtin-plugin/css-extract/loader.js",
       },
       {
-        "loader": "<ROOT>/packages/core/compiled/css-loader",
+        "loader": "<ROOT>/packages/core/compiled/css-loader/index.js",
         "options": {
           "importLoaders": 2,
           "modules": {
@@ -179,8 +179,9 @@ exports[`should ensure isolation of PostCSS config objects between different bui
         },
       },
       {
-        "loader": "<ROOT>/packages/core/compiled/postcss-loader",
+        "loader": "<ROOT>/packages/core/compiled/postcss-loader/index.js",
         "options": {
+          "implementation": "<ROOT>/packages/core/compiled/postcss/index.js",
           "postcssOptions": {
             "config": false,
             "plugins": [
@@ -211,7 +212,7 @@ exports[`should ensure isolation of PostCSS config objects between different bui
         "loader": "<ROOT>/node_modules/<PNPM_INNER>/@rspack/core/dist/builtin-plugin/css-extract/loader.js",
       },
       {
-        "loader": "<ROOT>/packages/core/compiled/css-loader",
+        "loader": "<ROOT>/packages/core/compiled/css-loader/index.js",
         "options": {
           "importLoaders": 2,
           "modules": {
@@ -236,8 +237,9 @@ exports[`should ensure isolation of PostCSS config objects between different bui
         },
       },
       {
-        "loader": "<ROOT>/packages/core/compiled/postcss-loader",
+        "loader": "<ROOT>/packages/core/compiled/postcss-loader/index.js",
         "options": {
+          "implementation": "<ROOT>/packages/core/compiled/postcss/index.js",
           "postcssOptions": {
             "config": false,
             "plugins": [

diff --git a/packages/core/tests/__snapshots__/default.test.ts.snap b/packages/core/tests/__snapshots__/default.test.ts.snap
@@ -41,7 +41,7 @@ exports[`applyDefaultPlugins > should apply default plugins correctly 1`] = `
             "loader": "<ROOT>/node_modules/<PNPM_INNER>/@rspack/core/dist/builtin-plugin/css-extract/loader.js",
           },
           {
-            "loader": "<ROOT>/packages/core/compiled/css-loader",
+            "loader": "<ROOT>/packages/core/compiled/css-loader/index.js",
             "options": {
               "importLoaders": 1,
               "modules": {
@@ -441,7 +441,7 @@ exports[`applyDefaultPlugins > should apply default plugins correctly when prod
             "loader": "<ROOT>/node_modules/<PNPM_INNER>/@rspack/core/dist/builtin-plugin/css-extract/loader.js",
           },
           {
-            "loader": "<ROOT>/packages/core/compiled/css-loader",
+            "loader": "<ROOT>/packages/core/compiled/css-loader/index.js",
             "options": {
               "importLoaders": 1,
               "modules": {
@@ -903,7 +903,7 @@ exports[`applyDefaultPlugins > should apply default plugins correctly when targe
             "loader": "<ROOT>/packages/core/dist/ignoreCssLoader.cjs",
           },
           {
-            "loader": "<ROOT>/packages/core/compiled/css-loader",
+            "loader": "<ROOT>/packages/core/compiled/css-loader/index.js",
             "options": {
               "importLoaders": 0,
               "modules": {
@@ -1237,7 +1237,7 @@ exports[`tools.rspack > should match snapshot 1`] = `
             "loader": "<ROOT>/node_modules/<PNPM_INNER>/@rspack/core/dist/builtin-plugin/css-extract/loader.js",
           },
           {
-            "loader": "<ROOT>/packages/core/compiled/css-loader",
+            "loader": "<ROOT>/packages/core/compiled/css-loader/index.js",
             "options": {
               "importLoaders": 1,
               "modules": {

diff --git a/packages/core/tests/__snapshots__/environments.test.ts.snap b/packages/core/tests/__snapshots__/environments.test.ts.snap
@@ -1409,7 +1409,7 @@ exports[`environment config > tools.rspack / bundlerChain can be used in environ
               "loader": "<ROOT>/node_modules/<PNPM_INNER>/@rspack/core/dist/builtin-plugin/css-extract/loader.js",
             },
             {
-              "loader": "<ROOT>/packages/core/compiled/css-loader",
+              "loader": "<ROOT>/packages/core/compiled/css-loader/index.js",
               "options": {
                 "importLoaders": 1,
                 "modules": {
@@ -1756,7 +1756,7 @@ exports[`environment config > tools.rspack / bundlerChain can be used in environ
               "loader": "<ROOT>/packages/core/src/ignoreCssLoader.cjs",
             },
             {
-              "loader": "<ROOT>/packages/core/compiled/css-loader",
+              "loader": "<ROOT>/packages/core/compiled/css-loader/index.js",
               "options": {
                 "importLoaders": 0,
                 "modules": {

diff --git a/packages/plugin-less/tests/__snapshots__/index.test.ts.snap b/packages/plugin-less/tests/__snapshots__/index.test.ts.snap
@@ -13,7 +13,7 @@ exports[`plugin-less > should add less-loader 1`] = `
         "loader": "<ROOT>/node_modules/<PNPM_INNER>/@rspack/core/dist/builtin-plugin/css-extract/loader.js",
       },
       {
-        "loader": "<ROOT>/packages/core/compiled/css-loader",
+        "loader": "<ROOT>/packages/core/compiled/css-loader/index.js",
         "options": {
           "importLoaders": 2,
           "modules": {
@@ -65,10 +65,10 @@ exports[`plugin-less > should add less-loader and css-loader when injectStyles 1
     "test": /\\\\\\.less\\$/,
     "use": [
       {
-        "loader": "<ROOT>/packages/core/compiled/style-loader",
+        "loader": "<ROOT>/packages/core/compiled/style-loader/index.js",
       },
       {
-        "loader": "<ROOT>/packages/core/compiled/css-loader",
+        "loader": "<ROOT>/packages/core/compiled/css-loader/index.js",
         "options": {
           "importLoaders": 2,
           "modules": {
@@ -126,7 +126,7 @@ exports[`plugin-less > should add less-loader with excludes 1`] = `
         "loader": "<ROOT>/node_modules/<PNPM_INNER>/@rspack/core/dist/builtin-plugin/css-extract/loader.js",
       },
       {
-        "loader": "<ROOT>/packages/core/compiled/css-loader",
+        "loader": "<ROOT>/packages/core/compiled/css-loader/index.js",
         "options": {
           "importLoaders": 2,
           "modules": {
@@ -181,7 +181,7 @@ exports[`plugin-less > should add less-loader with tools.less 1`] = `
         "loader": "<ROOT>/node_modules/<PNPM_INNER>/@rspack/core/dist/builtin-plugin/css-extract/loader.js",
       },
       {
-        "loader": "<ROOT>/packages/core/compiled/css-loader",
+        "loader": "<ROOT>/packages/core/compiled/css-loader/index.js",
         "options": {
           "importLoaders": 2,
           "modules": {

diff --git a/packages/plugin-react/tests/__snapshots__/index.test.ts.snap b/packages/plugin-react/tests/__snapshots__/index.test.ts.snap
@@ -57,7 +57,7 @@ exports[`plugins/react > should work with swc-loader 1`] = `
             "loader": "<ROOT>/node_modules/<PNPM_INNER>/@rspack/core/dist/builtin-plugin/css-extract/loader.js",
           },
           {
-            "loader": "<ROOT>/packages/core/compiled/css-loader",
+            "loader": "<ROOT>/packages/core/compiled/css-loader/index.js",
             "options": {
               "importLoaders": 1,
               "modules": {

diff --git a/packages/plugin-sass/tests/__snapshots__/index.test.ts.snap b/packages/plugin-sass/tests/__snapshots__/index.test.ts.snap
@@ -13,7 +13,7 @@ exports[`plugin-sass > should add sass-loader 1`] = `
         "loader": "<ROOT>/node_modules/<PNPM_INNER>/@rspack/core/dist/builtin-plugin/css-extract/loader.js",
       },
       {
-        "loader": "<ROOT>/packages/core/compiled/css-loader",
+        "loader": "<ROOT>/packages/core/compiled/css-loader/index.js",
         "options": {
           "importLoaders": 3,
           "modules": {
@@ -67,10 +67,10 @@ exports[`plugin-sass > should add sass-loader and css-loader when injectStyles 1
     "test": /\\\\\\.s\\(\\?:a\\|c\\)ss\\$/,
     "use": [
       {
-        "loader": "<ROOT>/packages/core/compiled/style-loader",
+        "loader": "<ROOT>/packages/core/compiled/style-loader/index.js",
       },
       {
-        "loader": "<ROOT>/packages/core/compiled/css-loader",
+        "loader": "<ROOT>/packages/core/compiled/css-loader/index.js",
         "options": {
           "importLoaders": 3,
           "modules": {
@@ -130,7 +130,7 @@ exports[`plugin-sass > should add sass-loader with excludes 1`] = `
         "loader": "<ROOT>/node_modules/<PNPM_INNER>/@rspack/core/dist/builtin-plugin/css-extract/loader.js",
       },
       {
-        "loader": "<ROOT>/packages/core/compiled/css-loader",
+        "loader": "<ROOT>/packages/core/compiled/css-loader/index.js",
         "options": {
           "importLoaders": 3,
           "modules": {

diff --git a/packages/plugin-stylus/tests/__snapshots__/index.test.ts.snap b/packages/plugin-stylus/tests/__snapshots__/index.test.ts.snap
@@ -13,7 +13,7 @@ exports[`plugin-stylus > should add stylus loader config correctly 1`] = `
         "loader": "<ROOT>/node_modules/<PNPM_INNER>/@rspack/core/dist/builtin-plugin/css-extract/loader.js",
       },
       {
-        "loader": "<ROOT>/packages/core/compiled/css-loader",
+        "loader": "<ROOT>/packages/core/compiled/css-loader/index.js",
         "options": {
           "importLoaders": 2,
           "modules": {
@@ -61,7 +61,7 @@ exports[`plugin-stylus > should allow to configure stylus options 1`] = `
         "loader": "<ROOT>/node_modules/<PNPM_INNER>/@rspack/core/dist/builtin-plugin/css-extract/loader.js",
       },
       {
-        "loader": "<ROOT>/packages/core/compiled/css-loader",
+        "loader": "<ROOT>/packages/core/compiled/css-loader/index.js",
         "options": {
           "importLoaders": 2,
           "modules": {