tools.sass
- 类型:
Object | Function
- 默认值:
const defaultOptions = {
// 默认在开发环境下启用 CSS 的 Source Map
sourceMap: isDev,
};
你可以通过 tools.sass
修改 sass-loader 的配置。
Object 类型
当 tools.sass
的值为 Object
类型时,会与默认配置通过 Object.assign 进行浅层合并,值得注意的是,sassOptions
会通过 deepMerge 进行深层合并。
export default {
tools: {
sass: {
sourceMap: true,
},
},
};
Function 类型
当 tools.sass
为 Function 类型时,默认配置作为第一个参数传入,可以直接修改配置对象,也可以返回一个值作为最终结果,第二个参数提供了一些可以直接调用的工具函数:
export default {
tools: {
sass(config) {
// 修改 sourceMap 配置
config.additionalData = async (content, loaderContext) => {
// ...
};
},
},
};
修改 Sass 版本
在某些场景下,如果你需要使用特定的 Sass 版本,而不是使用 Modern.js 内置的 Dart Sass v1,可以在项目中安装需要使用的 Sass 版本,并通过 sass-loader
的 implementation
选项设置。
export default {
tools: {
sass: {
implementation: require('sass'),
},
},
};
工具函数
addExcludes
- 类型:
(excludes: RegExp | RegExp[]) => void
用来指定 sass-loader
不编译哪些文件,你可以传入一个或多个正则表达式来匹配 sass 文件的路径。例如:
export default {
tools: {
sass(config, { addExcludes }) {
addExcludes(/node_modules/);
},
},
};