vue3.0 使用sass 进行css编译设置公共样式,

346 阅读 0 评论 229 点赞

我是靠谱客的博主跳跃鼠标，这篇文章主要介绍vue3.0 使用sass 进行css编译设置公共样式,，现在分享给大家，希望可以做个参考。

fm:
先去引两个命令:
注意版本不要太高不然会编译错误

复制代码

1
2
3
npm install node-sass --save
npm install sass-loader --save

我这里是这样的你自己参考

复制代码

1
2
3
4

"node-sass": "^4.14.1",
"sass-loader": "^7.3.1",

然后在vue.config.js；里面添加这些这个data里面包含了两个文件就是说可以编译这两个scss文件，多文件的然后注意你的sass版本字段名会不一样

复制代码

1
2
3
4
5
6
7
8
9
10
11
 css: {
loaderOptions: {
// 给 sass-loader 传递选项
sass: {
// sass-loader版本V8以下
data:`@import "@/assets/scss/common.scss"; @import "@/assets/scss/style.scss"; `
// sass-loader版本V8以上
// prependData: '@import "~@/assets/scss/common.scss";'
},
}

这样之后你在任何文件里都可以使用还要更多的sass好用的方法
可以看这个一些基本的使用 https://blog.csdn.net/u014789022/article/details/87854962，