一下載koala工具
- 下載地址：http://dl.zasuv.com/download/koala_31@64143.exe
傻瓜式安裝即可。 - 安轉(zhuǎn)好的界面
圖片.png
可以在設(shè)置里修改語言
二铅歼、設(shè)置和使用
-
設(shè)置語言
圖片.png
险绘！注意需要重啟才可以生效...
- 設(shè)置less編譯參數(shù)
圖片.png
source map表示生成的css與less文件的對應(yīng)地圖
line comments 表示生成的css開啟行注釋
compress 表示輸出的css是壓縮版的
注意正式環(huán)境關(guān)閉行注釋
！ 注意文件修改后會自動編譯色建，只需引入生成好的css即可哺呜，less文件錯誤是會有錯誤提示。
- 這樣你就可以開調(diào)試時看到這樣的
圖片.png
less對應(yīng)得位置
- 添加文件
圖片.png
添加less文件夾到這里（添加按鈕和拖拽都可以）箕戳，右鍵可以重命名某残，方便分類
圖片.png
右側(cè)是文件列表，點擊可以單獨設(shè)置參數(shù)
圖片.png
右鍵可以設(shè)置輸出路徑（默認是當(dāng)前路徑）
圖片.png
三陵吸、less語法需注意的地方
- 完全支持css語法
-
可以引入less文件(文件可以省略.less)玻墅，模塊化css開發(fā)
圖片.png -
也可以引入css，文件必須加上.css
圖片.png
*支持混合壮虫，可以這樣寫
圖片.png - 定義變量
圖片.png
調(diào)用變量澳厢，采用就近原則
圖片.png
- 運算符要空空格
圖片.png
更多用法可以參考：http://less.bootcss.com/functions/
圖片.png
體驗把css單做編程語言開發(fā)的樂趣吧，同時koala還可以壓縮js旨指，將多個js文件合并壓縮為一個赏酥，減少http請求，用法
// @koala-prepend "xxx.js"為include包含js文件
