Sublime Less 自動編譯成css


最近迷戀上sublime用於前端開發,性能高,靈活,是非常值得推薦的一款開發利器。

下面介紹下sublime中使用less遇到的問題及解決辦法:

1. less文件無法高亮顯示;

2. 在編輯完less文件后,保存時,自動編譯為對應的css文件;

需要安裝的插件有:

1.Less高亮顯示插件https://github.com/wbond/sublime_package_control

  將下載的文件解壓放到Package目錄下,如下圖:

  

  

2. Less2Css   

安裝Less2Css時,需要先安裝Package Control。

查看是否安裝Package Control :可以點擊菜單 Prefrences ,看下是否有Package Control子菜單,或者快捷鍵(Ctrl+Shift+P)輸入Package Control。

如果沒有找到,則需要安裝.

安裝Package Control步驟:1. https://github.com/wbond/sublime_package_control 下載該文件;2.Prefrences >Browser Packages會打開Sublime的安裝目錄,點擊上一層找到Installed Packages文件夾,打開該文件夾,將步驟1中下載的文件解壓到改文件夾內。3.重啟Sublime。

 

完成Package Control安裝后,可以進行下一步,安裝Less2Css;

步驟:1.快捷鍵 Ctrl+Shift+P(菜單 – Tools – Command Paletter),輸入 install 選中Install Package並回車,輸入或選擇Less2Css(注意左下角的小文字變化,會提示安裝成功)。 

2. https://github.com/duncansmart/less.js-windows 下載該文件並解壓到本地目錄(eg:D:\less.js-windows-master);點擊計算機 右擊 屬性,選擇高級系統設置,編輯Path ,將解壓目錄,添加到PATH中。

3. 安裝完以上操作,重啟Sublime后,Control+s 保存Less文件,會在同目錄下生成相應的.css文件。至此操作已經完成。如果想改變快捷鍵和生成css的格式,打開

復制Settings-Default內的內容到Settings-User中,更改其中的值,例如把minName變為True,minify變為True,會生成相應的x.min.css文件。

 

本文介紹到這里,有問題可以問我哦!

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM