webstorm配置scss環(huán)境圖文教程

1.下載 Ruby  (安裝過程中記得勾選添加到環(huán)境變量，安裝結(jié)束最后可能會彈出一個cmd彈框，可以忽略)

2. cmd安裝sass

gem install sass

3. cmd檢查是否安裝

sass -v

重點是接下來

File>Setting>Tools>File Watchers ,點擊右上角加號選擇scss,出現(xiàn)以下界面

紅框標(biāo)示為解析器，每個人安裝目錄可能不一樣，但最后幾個目錄肯定是相同的。附C盤安裝默認(rèn)路徑   C:\Ruby24-x64\bin\scss.bat

綠框標(biāo)示為生成編譯文件的存放目錄，一般有兩種寫法，具體如下

1.    --no-cache --update $FileName$:$FileNameWithoutExtension$.css

2.    --no-cache --update $FileName$:$FileParentDir$\css\$FileNameWithoutExtension$.css