1.安装node-sass
yarn add sass-loader node-sass
或npm i sass-loader node-sass
这样就可以识别.vue文件中的scss语法了,但不能使用全局变量
2.安装style-resources(全局使用scss变量)
yarn add @nuxtjs/style-resources
或 npm i @nuxtjs/style-resources
3.配置nuxt.config.js中的module
modules: [
'@nuxtjs/style-resources'
],
styleResources: {
scss: './assets/css/variables.scss', 注意这里不能使用别名(即~/@)
// sass: ...
},
这样就可以在任何地方使用scss变量了
styleresources官方教程