為什么80%的碼農都做不了架構師？>>> ??

一、安裝rubu環境

本文轉自:https://www.edik.cn/article/61.html

1.下載ruby

因為sass依賴于ruby

下載地址：http://rubyinstaller.org/downloads

選擇自己對應的操作系統下載

2.安裝ruby

第二步的時候注意勾選第二項，是添加環境變量，后邊都選擇默認即可安裝完畢。

二、安裝sass

1.找到ruby命令行

從開始菜單中找到剛安裝的ruby，點擊Start Command Prompt with Ruby，打開命令行

2.安裝sass

在命令行中輸入以下命令，并回車

gem install sass

稍等片刻便會提示安裝成功。如果不成功說明被墻了，請自行解決，反正我的正常安裝了。

至此，準備工作完畢！

三、配置IDE

1.打開設置

打開IDE，依次打開File→Settings→File?Watchers

注：IntelliJ IDEA中沒有自帶File?Watchers插件，需要自行從插件中心下載（這個應該都會，實在有不會的請留言）

2.添加配置

點擊右上角的綠色 “+” 號，并選擇scss，如圖

3.選擇安裝的sass

如圖所示是sass的默認安裝路徑

4.編輯輸出路徑

我的設置是在當前路徑下生成css，附上配置

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

5.完成設置

點擊OK完成配置

?

使用注意

1.同步編譯只能在項目文件夾下，也就是webstorm左側打開的項目，隨便打開一個項目外的文件是不行的

?

2.目錄名或文件名不要帶中文

轉載于:https://my.oschina.net/edik/blog/807160

總結

以上是生活随笔為你收集整理的WebStorm、PHPStorm、IntelliJ IDEA配置scss自动编译的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。