webstorm配置編譯sass的輸出目錄

關於這個的問題，雖說不是很難，但還是踩了點小坑，下面就來介紹下如何使用webstorm配置編譯scss的輸出目錄。

1.下載Ruby

2.使用Ruby安裝sass

gem install sass

3.檢測是否安裝成功。

sass -v

注意：關於sass和scss大家可以去查一下，這兩個本質上的是一個東西。

前面的幾步很多教程上都有，就不詳細說了。

一般來說，我們期望scss目錄和css目錄是單獨分開的，在scss目錄中建立index.scss的文件。會彈出如上提示，點擊yes，如果不小心點了no的話……

一樣可以進入這個頁面。

如果這樣的默認路徑，編譯好的css文件是會直接生成在scss文件下。

但是我們可以將Arguments中的路徑 --no-cache --update $FileName$:$FileNameWithoutExtension$.css

改成這樣--no-cache --update $FileName$:$FileParentDir$\css\$FileNameWithoutExtension$.css

這樣的話，生成的css文件就會在css目錄下了

最后在提一點，如果要在scss文件中，輸入中文的話，需要寫上 

@charset "UTF-8";