- 首先：
sass基于Ruby语言开发而成，因此安装sass前需要安装Ruby。（注:mac下自带Ruby无需在安装Ruby!）
mac用户挺开心的。。。 - 安装
sass：
//安装如下(如mac安装遇到权限问题需加 sudo gem install sass)
gem install sass
gem install compass
- 查看安装是否成功：
sass -v
Sass 3.x.x (Selective Steve)
- 打开vscode，插件商店里搜索:
easysass,然后在settings.json设置里，把下面代码粘贴上去：
"easysass.compileAfterSave": true, //自动编译
"easysass.formats": [ //nested：嵌套缩进的 css 代码。
//expanded：没有缩进的、扩展的css代码。
//compact：简洁格式的 css 代码。
//compressed：压缩后的 css 代码
{
"format": "expanded",
"extension": ".css"
},
{
"format": "compressed",
"extension": ".min.css"
}
],
"easysass.targetDir": "css/",
-
创建目录如下：
用的scss..请见谅。。。
然后可以在scss/sass里面舒服地定义变量和嵌套了
.header-top {
@extend .flex;
padding: 10px 0;
input {
width: 451px;
height: 31px;
outline: unset;
padding: 0 10px;
}
img {
margin-right: 20px;
}
}
然后control+s或者command+s会奇迹般得出现两个文件：
每保存一次就会自动编译一次
- 没了
