安装scss成全局变量
时间: 2023-06-06 13:09:09 浏览: 92
很高兴为您解答,安装scss成全局变量的具体步骤如下:
1. 首先,您需要安装 sass-resources-loader,可以通过 npm install sass-resources-loader --save-dev 命令安装。
2. 然后,在 webpack 的配置文件中使用 sass-resources-loader,将您的 scss 文件引入到全局中,具体代码如下:
```javascript
module.exports = {
module: {
rules: [
{
test: /\.scss$/,
use: [
'style-loader',
'css-loader',
'sass-loader',
{
loader: 'sass-resources-loader',
options: {
resources: [
path.resolve(__dirname, 'src/styles/variables.scss'),
path.resolve(__dirname, 'src/styles/mixins.scss')
]
}
}
]
}
]
}
}
```
其中,'sass-resources-loader' 负责将您的 scss 文件引入到全局中,'resources' 参数列出了所有需要引入的文件路径。
3. 最后,您可以在任何组件中使用全局变量了,比如:
```scss
$primary-color: #f90;
.button {
background-color: $primary-color;
}
```
以上就是安装 scss 成全局变量的详细步骤,希望对您有所帮助。
阅读全文