docs: update the sourceMap default value of css loaders (web-infra-de…

…v#961)
dribble-njr · Dec 15, 2023 · 105e42f · 105e42f
1 parent 48597cf
commit 105e42f
Show file tree

Hide file tree

Showing 11 changed files with 20 additions and 26 deletions.
diff --git a/e2e/cases/css/resolve-alias/index.test.ts b/e2e/cases/css/resolve-alias/index.test.ts
@@ -1,17 +1,9 @@
-import path from 'path';
 import { expect, test } from '@playwright/test';
 import { build } from '@scripts/shared';
 
 test('should compile CSS with alias correctly', async () => {
   const rsbuild = await build({
     cwd: __dirname,
-    rsbuildConfig: {
-      source: {
-        alias: {
-          '@common': path.resolve(__dirname, 'src/common'),
-        },
-      },
-    },
   });
   const files = await rsbuild.unwrapOutputJSON();
 

diff --git a/e2e/cases/css/resolve-alias/rsbuild.config.ts b/e2e/cases/css/resolve-alias/rsbuild.config.ts
@@ -0,0 +1,9 @@
+import path from 'path';
+
+export default {
+  source: {
+    alias: {
+      '@common': path.resolve(__dirname, 'src/common'),
+    },
+  },
+};
diff --git a/packages/core/src/provider/plugins/sass.ts b/packages/core/src/provider/plugins/sass.ts
@@ -22,6 +22,7 @@ export function pluginSass(): RsbuildPlugin {
         const { excludes, options } = getSassLoaderOptions(
           config.tools.sass,
           // source-maps required for loaders preceding resolve-url-loader
+          // otherwise the resolve-url-loader will throw an error
           true,
         );
 

diff --git a/packages/document/docs/en/config/tools/css-loader.mdx b/packages/document/docs/en/config/tools/css-loader.mdx
@@ -10,13 +10,12 @@ The config of [css-loader](https://github.com/webpack-contrib/css-loader) can be
   modules: {
     auto: true,
     exportLocalsConvention: 'camelCase',
-    localIdentName: config.output.cssModules.localIdentName,
+    localIdentName: rsbuildConfig.output.cssModules.localIdentName,
     // isServer indicates node (SSR) build
     // isWebWorker indicates web worker build
     exportOnlyLocals: isServer || isWebWorker,
   },
-  // CSS Source Map enabled by default in development environment
-  sourceMap: isDev,
+  sourceMap: rsbuildConfig.output.sourceMap.css,
   // importLoaders is `1` when compiling css files, and is `2` when compiling sass/less files
   importLoaders: 1 || 2,
 }

diff --git a/packages/document/docs/en/config/tools/less.mdx b/packages/document/docs/en/config/tools/less.mdx
@@ -8,8 +8,7 @@ const defaultOptions = {
   lessOptions: {
     javascriptEnabled: true,
   },
-  // CSS Source Map enabled by default in development environment
-  sourceMap: isDev,
+  sourceMap: rsbuildConfig.output.sourceMap.css,
 };
 ```
 

diff --git a/packages/document/docs/en/config/tools/postcss.mdx b/packages/document/docs/en/config/tools/postcss.mdx
@@ -11,8 +11,7 @@ const defaultOptions = {
       require('postcss-flexbugs-fixes'),
       require('autoprefixer')({ flexbox: 'no-2009' }),
     ],
-    // CSS Source Map enabled by default in development environment
-    sourceMap: isDev,
+    sourceMap: rsbuildConfig.output.sourceMap.css,
   },
 };
 ```

diff --git a/packages/document/docs/en/config/tools/sass.mdx b/packages/document/docs/en/config/tools/sass.mdx
@@ -5,8 +5,7 @@
 
 ```js
 const defaultOptions = {
-  // CSS Source Map enabled by default in development environment
-  sourceMap: isDev,
+  sourceMap: true,
 };
 ```
 

diff --git a/packages/document/docs/zh/config/tools/css-loader.mdx b/packages/document/docs/zh/config/tools/css-loader.mdx
@@ -10,13 +10,12 @@
   modules: {
     auto: true,
     exportLocalsConvention: 'camelCase',
-    localIdentName: config.output.cssModules.localIdentName,
+    localIdentName: rsbuildConfig.output.cssModules.localIdentName,
     // isServer 表示 node (SSR) 构建
     // isWebWorker 表示 web worker 构建
     exportOnlyLocals: isServer || isWebWorker,
   },
-  // 默认在开发环境下启用 CSS 的 Source Map
-  sourceMap: isDev,
+  sourceMap: rsbuildConfig.output.sourceMap.css,
   // importLoaders 在编译 css 文件时为 `1`，在编译 sass/less 文件时为 `2`
   importLoaders: 1 || 2,
 }

diff --git a/packages/document/docs/zh/config/tools/less.mdx b/packages/document/docs/zh/config/tools/less.mdx
@@ -8,8 +8,7 @@ const defaultOptions = {
   lessOptions: {
     javascriptEnabled: true,
   },
-  // 默认在开发环境下启用 CSS 的 Source Map
-  sourceMap: isDev,
+  sourceMap: rsbuildConfig.output.sourceMap.css,
 };
 ```
 

diff --git a/packages/document/docs/zh/config/tools/postcss.mdx b/packages/document/docs/zh/config/tools/postcss.mdx
@@ -11,8 +11,7 @@ const defaultOptions = {
       require('postcss-flexbugs-fixes'),
       require('autoprefixer')({ flexbox: 'no-2009' }),
     ],
-    // 默认在开发环境下启用 CSS 的 Source Map
-    sourceMap: isDev,
+    sourceMap: rsbuildConfig.output.sourceMap.css,
   },
 };
 ```

diff --git a/packages/document/docs/zh/config/tools/sass.mdx b/packages/document/docs/zh/config/tools/sass.mdx
@@ -5,8 +5,7 @@
 
 ```js
 const defaultOptions = {
-  // 默认在开发环境下启用 CSS 的 Source Map
-  sourceMap: isDev,
+  sourceMap: true,
 };
 ```