vue使用scss全局变量时报错:
ValidationError: Invalid options object. Sass Loader has been initialized using an options object that does not match the API schema.
package.json
"dependencies": { "axios": "^0.21.1", "core-js": "^3.6.5", "element-ui": "^2.15.2", "vue": "^2.6.11", "vue-router": "^3.2.0", "vuex": "^3.4.0" }, "devDependencies": { "@vue/cli-plugin-babel": "~4.5.0", "@vue/cli-plugin-router": "~4.5.0", "@vue/cli-plugin-vuex": "~4.5.0", "@vue/cli-service": "~4.5.0", "vue-template-compiler": "^2.6.11", "node-sass": "^6.0.1", "sass-loader": "^10.2.0", },
vue.config.js
module.exports={ css: { loaderOptions: { sass: { additionalData: `@import "@/styles/_variable.scss";` } } } }
文档说明:
https://cli.vuejs.org/zh/guide/css.html#%E5%90%91%E9%A2%84%E5%A4%84%E7%90%86%E5%99%A8-loader-%E4%BC%A0%E9%80%92%E9%80%89%E9%A1%B9
注:根据sass-loader版本不同,字段分别为 data、prependData、additionalData,若都不能解决可以查看上方官方文档链接。