vue定义一个全局的scss文件,供全局使用

在开发中,我们会有一些全局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