webstorm 配置 less 自動編譯

2021-10-25 07:57:48 字數 899 閱讀 1828

查了一些都有點偏差,找到方法後記錄下~

【windows環境下】

npm i less -g

安裝後,會出現乙個安裝路徑:

檢查是否安裝好:lessc -vwebstorm中配置位置:

file – settings – tools – file watchers

增加乙個less型別的watcher:

最簡單的配置就是只修改program的值,這個是放lessc.cmd的路徑。

如上安裝路徑,但開啟資料夾看,其實並沒有lessc.cmd

arguments:

$filename$ $filenamewithoutextension$.css --source-map(webstorm預設值)

output path to refresh:

$filenamewithoutextension$.css:$filenamewithoutextension$.css.map(webstorm預設值)

按如上配置,編譯後檔案結構如下:

webstorm配置less解析的方法及注意事項

一 準備 二 配置步驟 1 安裝js解析器node.js。直接下一步就ok了。2 將npm壓縮包解壓,找到裡面的lessc.cmd檔案,放到c盤下乙個沒有中文路徑的目錄下,我們假如是 c xampp htdocs tools npm 3 3.1 開啟webstorm file settings to...

WebStorm 8 0安裝LESS編譯環境的教程

1 首先安裝webstorm 8.0 2 安裝nodejs nodejs官方版本有32位和64位,可以根據實際需要進行選擇安裝。3 安裝less 安裝成功的介面是這樣的 如圖 在這裡,我們能夠看到lessc安裝的目錄,這個要先記下來。4 在webstorm裡面配置less編譯 這個步驟稍微複雜一些,...

webstorm主題配置

自定義語法高亮 用ctrl alt s開啟settings介面,editor colors fonts。不同語言有各自的語法高亮規則,但有一部分是通用的 general 我們首先來設定general,然後再根據需要設定不同語言的語法高亮。general的設定 普通文字 default text 摺疊...