1.vs code：
安裝兩個插件：
sass
easy sass
2.webstorm：
安裝Ruby:http://www.ruby-lang.org/zh_cn/
我的是win10 x64系統，地址在這里：https://rubyinstaller.org/downloads/
其他根據系統相應的下載安裝，沒有什么特別的安裝要求，連續下一步就好。安裝完成以后打開系統控制台安裝sass:
gem install sass
安裝完成以后進入webstorm:File-->settings-->Tools-->File Watchers-->
然后選擇+ --> scss
在Program(編號1的輸入框),通過后面的文件夾符號選擇Ruby的安裝路徑下的scss.bat
Ruby安裝路徑 + \bin\scss.bat
然后在Arguments中配置編譯參數（編號2的輸入框）：
//默認配置編譯參數 $FileName$:$FileNameWithoutExtension$.css //我的自定義配置編譯參數 --sourcemap=none --no-cache -t expanded $FileName$:$FileNameWithoutExtension$.css
配置編譯的一些參數說明：
--sourcemap=none 不生成map文件 --no-cache 不生成sass-cache文件夾 -t compact 每行樣式一行 -t nested 右括號在末尾 -t expanded 普通格式 -t compressed 壓縮成一行
3.在控制台使用sass命令編譯：
//--sourcemap=none 不生成map文件 --no-cache不生成sass-cache文件夾 # 右括號在末尾 sass index-pc.scss index-pc.css --sourcemap=none --no-cache --style nested # 普通格式 sass index-pc.scss index-pc.css --sourcemap=none --no-cache --style expanded # 每行樣式一行 sass index-pc.scss index-pc.css --sourcemap=none --no-cache --style compact # 壓縮成一行 sass index-pc.scss index-pc.css --sourcemap=none --no-cache --style compressed