vue项目中使用scss全局变量
2021/7/14 23:13:23
本文主要是介绍vue项目中使用scss全局变量,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!
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,若都不能解决可以查看上方官方文档链接。
这篇关于vue项目中使用scss全局变量的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!
- 2024-11-01Vue.js 是什么-icode9专业技术文章分享
- 2024-11-01Vue3入门教程:从零开始搭建第一个Vue3项目
- 2024-11-01详解vueRouter4基础教程
- 2024-11-01Vuex4课程:初学者的完整入门指南
- 2024-10-31Vue3课程:新手入门到初级掌握
- 2024-10-31Vue3课程:新手入门到初级应用详解
- 2024-10-31VueRouter4课程:新手入门与实战指南
- 2024-10-31Vuex4学习:从入门到初级实战教程
- 2024-10-31Vue3教程:新手入门与基础实战
- 2024-10-31Vue教程:新手快速入门指南