vue中配置sass遇到了一些问题,经过反复测试发现是版本问题
我的项目创建用的是vue官网上的方式,创建的是vue2.0版本的项目
之后我通过执行yarn add sass-loader
和yarn add node-sass
安装插件,安装的版本都是默认版本,可能是最新版本
"dependencies": {
"core-js": "^3.6.5",
"node-sass": "^6.0.1",
"sass-loader": "^12.1.0",
"vue": "^2.6.11"
}
之后在vue文件中样式加入scss,并使用scss语法写样式
<style scoped lang="scss">
#app {
font-family: Avenir, Helvetica, Arial, sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-align: center;
color: #2c3e50;
margin-top: 60px;
a{
color: red;
}
}
</style>
报如下错误
本人愚钝在报错内容中未发现具体是什么错误,该怎么解决,后来在网上搜索解决办法,加上不断尝试最后发现是版本问题
执行
yarn add node-sass@4.12.0
和yarn add sass-loader@7.1.0
"dependencies": {
"core-js": "^3.6.5",
"node-sass": "4.12.0",
"sass-loader": "7.1.0",
"vue": "^2.6.11"
}
重新启动项目,scss就好用了,不知道有没有更好地方式解决这个问题
网友评论