vue中scss、sass和scss三者的区别是什么？针对这个问题，这篇文章详细介绍了相对应的分析和解答，希望可以帮助更多想解决这个问题的小伙伴找到更简单易行的方法。
创新互联专注于企业网络营销推广、网站重做改版、龙川网站定制设计、自适应品牌网站建设、H5响应式网站、商城系统网站开发、集团公司官网建设、外贸网站制作、高端网站制作、响应式网页设计等建站业务，价格优惠性价比高，为龙川等各大城市提供网站开发制作服务。
1. 安装依赖：npm install node-sass sass-loader -D
2. webpack.base.conf.js文件
module: {
{ //手动添加这一条，相当于是编译识别sass!
test: /\.scss$/,
loaders: ["style", "css", "sass"]}
}3. 在.vue文件中使用
.box{
width: 100%; :hover{ color: red; }
}
下面看下sass与scss的区别
用了很久css预编译器，但是一直不太清楚到底用的sass还是scss，直到有天被问住了有点尴尬，找了个教程撸了遍==。。。
1.异同：简言之可以理解scss是sass的一个升级版本，完全兼容sass之前的功能，又有了些新增能力。语法形式上有些许不同，最主要的就是sass是靠缩进表示嵌套关系，scss是花括号
//sass 太费眼了
.father
width:100px;
.son
width:50px;
//scss 适合我这种眼瘸手残患者
.father{
width:100px;
.son{
width:50px;
}
}2 .scss功能很强大的样子，能做运算、写函数啥的，但是我只是作为语法糖用而已，只看了些基础功能
我个人常用的功能有：
嵌套
变量 $color : #111111;
混入 @mixin
继承 @extend
3.一个关于@mixin、@extend、%placeholder的适用场景总结
总结：
关于vue中scss、sass和scss三者的区别是什么问题的解答就分享到这里了，希望以上内容可以对大家有一定的帮助，如果你还有很多疑惑没有解开，可以关注创新互联行业资讯频道了解更多相关知识。
本文标题：vue中scss、sass和scss三者的区别是什么
分享URL：
http://cdxtjz.cn/article/igeodo.html
