转载: https://blog.csdn.net/haochangdi123/article/details/80798813
1.安装scss
这些插件使我们使用scss所必须安装的
- 1
npm install node-sass --save-dev
npm install sass-loader --save-dev
npm install style-loader --save-dev
- 1
- 2
- 3
2.安装sass-resources-loader
这个插件是我们想要全局引用scss所要安装的
npm install sass-resources-loader --save-dev
- 1
3.创建公共scss
base.scss
写一些我们需要全局设置的一些基本样式,例如清除浮动
mixin.scss
这个文件就是我们scss的mixin文件了
index.scss
是我们scss的总体引入文件,将我们所有的公共scss引入,这样一来我们只要全局引用index.scss文件就可以了
- 1
//minxin
@import './mixin.scss';
//全局设置的基本样式
@import './base.scss';
4.全局引入
修改build中的utils.js
我们将
scss: generateLoaders('sass'),
- 1
改为:
scss: generateLoaders('sass').concat(
{
loader: 'sass-resources-loader',
options: {
//你自己的scss全局文件的路径
resources: path.resolve(__dirname, '../src/common/style/index.scss')
}
}
),