Vue项目中全局引入.scss文件

在用vue-cli开发项目的时候，需要全局引入一个公共的.scss文件供每个 .vue文件使用，而不需要在每个.vue文件中引入.scss文件

步骤一：
首先要下载 ： sass-resources-loader

npm install sass-resources-loader --save-dev

步骤二：
在项目build/utils.js里，找到如下图位置

修改为：

scss: generateLoaders('sass').concat(
      {
        loader: 'sass-resources-loader',
        options: {
          // 需要全局引入的sass文件，这里引入了的scss文件，在所有的.vue文件都可以用到这份css样式，
          // 下面的resources接受一个数组，可以添加多个scss文件
          resources: [path.resolve(__dirname, '../src/assets/sass/index.scss')]
        }
      }
    ),

tips:
'../src/assets/sass/index.scss' // 是你的scss文件的相对路径

如果要导入多个文件,有两种办法：
1、在上面代码的 resources 数组选项增加多一个 scss 文件路径。
2、在上面的 index.scss 文件里用 @import 引入其他 scss 文件。

步骤三：
运行 npm run dev 重启服务即可