如何使用 webpack pre-load SASS 自定义实用程序(变量和混合)

How to pre-load SASS custom utilities (variables and mixins) with webpack

我正在 base.scss 中加载我的实用程序和资产,就像这样

@import "_variables";
@import "_mixins";
...

我的应用程序中有大量模块,我们正在对这些模块进行大量更改。
所以在每个 scss 文件的 header 中导入 base.scss 会造成很多麻烦,而且看起来非常多余。

我尝试使用 sass 的 includePaths 但它没有帮助,因为它只解析 @import 声明。

有什么方法可以自动导入我的实用程序,而无需在每个文件中手动 @import 它?

这个加载程序会完成这项工作
https://github.com/shakacode/sass-resources-loader
通过将此添加到您的 webpack 配置

sassResources: [ './path/to/vars.scss', './path/to/mixins.scss' ]

更新

查看 this boilerplate

中的实际实施