在开发中,我们会有一些全局css,但是又不能每个vue文件做一次import,这样太繁琐了,所以可以通过配置sass-resources-loader来做一些处理,通过配置一个全局变量,达到无需再额外引用的作用。
操作步骤:
1.添加依赖
npm install sass-resources-loader --save-dev
2.修改build/utils.js文件配置,在如下位置修改配置信息
image.png
即在scss后的generateLoaders添加代码:
scss: generateLoaders('sass').concat(
{
loader: 'sass-resources-loader',
options: {
resources: path.resolve(__dirname, '../src/style/global.scss')
}
}
)
PS:resources 可以接收一个数组对象,如果有多个全局文件,也可以传入一个数组:
多个全局scss文件.png
网友评论