如何使用 webpack 预加载 SASS 自定义实用程序（变量和 mixins）
Posted
技术标签:
【中文标题】如何使用 webpack 预加载 SASS 自定义实用程序（变量和 mixins）【英文标题】：How to pre-load SASS custom utilities (variables and mixins) with webpack 【发布时间】：2016-11-22 06:10:31 【问题描述】：我正在像这样在base.scss 中加载我的实用程序和资产
@import "_variables";
@import "_mixins";
...
我的应用程序中有大量模块，我们正在对这些模块进行大量更改。
所以在每个 scss 文件的标题中导入 base.scss 会造成很多麻烦，而且看起来非常多余。
我尝试使用 sass 的 includePaths，但它没有帮助，因为它只解决了 @import 声明。
有什么方法可以自动导入我的实用程序，而无需在每个文件中手动 @import 导入它？
【问题讨论】：
【参考方案1】：这个加载器将完成这项工作https://github.com/shakacode/sass-resources-loader
通过将此添加到您的 webpack 配置中sassResources: [ './path/to/vars.scss', './path/to/mixins.scss' ]
更新
在this boilerplate 中查看实施情况
【讨论】：
以上是关于如何使用 webpack 预加载 SASS 自定义实用程序（变量和 mixins）的主要内容，如果未能解决你的问题，请参考以下文章
如何在 Rails 6 和 Webpacker（以及引导程序和 SASS/SCSS）中安装自定义字体
如何使用 Webpacker 将 `includePaths` 添加到 Sass 加载器
在 Webpack 2 中使用 TypeScript 加载 SASS 模块
webpack 配置scssless全局样式（自定义的，vue-cli2/3）