當前位置:首頁 » 編程軟體 » scss編譯異常

scss編譯異常

發布時間: 2023-11-18 16:47:55

『壹』 webstorm sass編譯報錯。

1,加一句編碼,@charset "UTF-8"

8,如果scss文件中帶中文會報錯,解決方法如上圖中第一行添加 @charset "UTF-8"

『貳』 webstorm 編譯 scss 文件報錯

打開webstorm創建空項目,點擊「File」菜單選擇「Setting」,搜索「watcher」關鍵字,

點擊右邊綠色加號,選擇「SCSS」文件類型。

輸入監視文件類型名稱(隨便寫),關鍵第二個選項,一定要選擇ruby安裝目錄bin文件下的scss.bat文件

最後,創建.scss文件輸入scss css代碼,保存後會生成後綴.css文件,就可以了。

『叄』 webstorm 配置sass輸出css文件格式配置

本文前提 是電腦里已經順利安裝了ruby,sass等之後,再進行webstorm中配置sass的watcher,以及改變watcher中的默認選項;如果以上都還沒有做,可以自行網路解決,很容易找到的;

本文使用的webstorm為11.0版本

點擊左上角的 *File→Settings→File Watchers ***

在彈窗的窗口的右上角點擊綠色的 『+』 號,然後選擇scss

然後按照下圖進行操作:

其中黃色的地方都要填好,program那裡是你安裝ruby中響應的scss.bat的路徑,如果安裝ruby時,你不是按照默認c盤路徑按裝的話,那麼那裡是需要需改的;

按道理其中只有兩個地方是需要修改的,其他我沒有改過,都是默認就是那樣的

1、Arguments:

可以配置編譯後的文件的輸出路徑,我這里寫的是:

--no-cache --update --sourcemap --watch : css$FileNameWithoutExtension$.css

注意, 後面有個冒號,然後 表示的是 scss文件所在的文件夾的父級文件夾 ,而不是scss文件的父文件夾.

舉個例子,我的項目叫lianxi,裡面有個sass文件夾,裡面存放scss文件,那麼按照這樣配置的結果, www.scss 所在的文件夾就是sass,sass的父文件夾就是lianxi,然後找到lianxi下的css文件夾,編譯後的 www.css 文件就會在這里.

如圖所示:

2、 Output paths to refresh:

改成這樣: .css: .css.map

經過以上配置就實現了, webstorm支持sass的同步編譯,也就是即寫即編譯,並且可以指定編譯後的css的目錄.

這里需要注意兩點:

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

2》這個和webstorm沒有什麼關系,就是sass編譯不能帶有中文,無論是路徑名,文件名,文件里的內容,都不能識別中文,如果要修改它也不是不可以,但我覺得不用中文也挺好的,養成好習慣嘛.

原文網址摘自於 http://www.jianshu.com/writer#/notebooks/8901255/notes/8479561

熱點內容
不是安卓怎麼讓時間顯示在屏幕上 發布:2025-07-01 15:20:54 瀏覽:507
黃岩數控編程培訓 發布:2025-07-01 15:12:30 瀏覽:977
迷宮尋路演算法 發布:2025-07-01 15:12:29 瀏覽:542
微信視頻緩存目錄 發布:2025-07-01 14:58:59 瀏覽:389
vmwarelinux教程 發布:2025-07-01 14:50:33 瀏覽:498
名詞解釋預演算法 發布:2025-07-01 14:34:36 瀏覽:918
iis文件拒絕訪問 發布:2025-07-01 14:34:20 瀏覽:570
蘋果和安卓相比哪個游戲多 發布:2025-07-01 14:24:16 瀏覽:762
銳界七座買哪個配置好 發布:2025-07-01 14:14:59 瀏覽:983
svn下載linux 發布:2025-07-01 14:10:38 瀏覽:735