本文由webstorm使用教程欄目為大家介紹webstorm下的sass編譯問(wèn)題，具有一定的參考價(jià)值，希望能夠幫助到大家。

webstorm下的sass編譯問(wèn)題

saas 需要運(yùn)行在 ruby 環(huán)境，所以需要安裝 ruby 32 / 64

1、安裝 ruby

2、DOS命令中，測(cè)試ruby是否安裝：ruby -v （回車(chē)，出現(xiàn)版本號(hào)則是ruby安裝成功）

3、安裝sass命令： gem install sass

4、測(cè)試sass是否安裝成功：sass -v（回車(chē)，出現(xiàn)版本號(hào)則是sass安裝成功）

方法一：DOS命令sass轉(zhuǎn)化問(wèn)css文件監(jiān)聽(tīng)

1、在 文件目錄中 ，打開(kāi) dos命令行的方法 :shift + 右擊

2、在命令行中輸入 sass命令，可以把sass文件 編譯為css文件

sass style.scss mystyle.css sass style.scss ../css/mystyle.css

監(jiān)聽(tīng)編譯：在sass 修改時(shí)，會(huì)同步修改css文件

sass --watch style.scss:../css/mystyle.css

3、退出監(jiān)聽(tīng) ctrl + c ，選擇 y

方法二：webstorm自帶監(jiān)聽(tīng)

1、一勞永逸：配置IDE 環(huán)境：

IDE 配置 （位置：setting –> Tools –> File watchers）

如果sass和css是兩個(gè)文件夾分別存放scss和css：

Arguments：--style expanded --no-cache --update $FileName$:../css/$FileNameWithoutExtension$.css

中文編譯報(bào)錯(cuò)：【不能使用任何帶中文的文件名和備注】 找到文件

1、 librubygems2.3.0gemssass-3.4.22libsassimportersfilesystem.rb的87行

if name.index(@root + "/") == 0 修改為 if name.encode("utf-8",'gbk').index(@root + "/") == 0

2、在.scss文件中的頭部加上下面這句話(huà) @charset “UTF-8”