首先,vue-cli中只需要安装node-sass和sass-loader就可以直接使用scss语法了,在组建的style标签中定义lang属性值为"scss"即可;但是就算在app.vue中引入公共scss文件也仅仅只能在app.vue中使用,要想全局使用这个文件中的变量或mixin就需要小配置一下了
两步:
1:cnpm install sass-resources-loader -D
2:打开 build/utils.js 文件(vue-cli 3.0以前版本才有,3.0版本还没有仔细研究,
只知道去掉了build和config文件夹),然后把scss: generateLoaders('sass')替换成如下代码
scss: generateLoaders('sass').concat({
loader: 'sass-resources-loader',
options: {
resources: path.resolve(__dirname, '../src/assets/scss/COLOR.scss')
}
}),
这个COLOR.scss就是需要全局使用的scss文件