- 首先：
sass基于Ruby語言開發(fā)而成徽职，因此安裝sass前需要安裝Ruby默怨。（注:mac下自帶Ruby無需在安裝Ruby!）
mac用戶挺開心的樟氢。解愤。镇饺。 - 安裝
sass：
//安裝如下(如mac安裝遇到權(quán)限問題需加 sudo gem install sass)
gem install sass
gem install compass
- 查看安裝是否成功：
sass -v
Sass 3.x.x (Selective Steve)
- 打開vscode，插件商店里搜索:
easysass,然后在settings.json設(shè)置里送讲，把下面代碼粘貼上去：
"easysass.compileAfterSave": true, //自動編譯
"easysass.formats": [ //nested：嵌套縮進(jìn)的 css 代碼奸笤。
//expanded：沒有縮進(jìn)的、擴(kuò)展的css代碼哼鬓。
//compact：簡潔格式的 css 代碼监右。
//compressed：壓縮后的 css 代碼
{
"format": "expanded",
"extension": ".css"
},
{
"format": "compressed",
"extension": ".min.css"
}
],
"easysass.targetDir": "css/",
-
創(chuàng)建目錄如下：
用的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會奇跡般得出現(xiàn)兩個文件：
每保存一次就會自動編譯一次
- 沒了
