一下载koala工具
- 下载地址：http://dl.zasuv.com/download/koala_31@64143.exe
傻瓜式安装即可。 - 安转好的界面
图片.png
可以在设置里修改语言
二、设置和使用
-
设置语言
图片.png
！注意需要重启才可以生效...
- 设置less编译参数
图片.png
source map表示生成的css与less文件的对应地图
line comments 表示生成的css开启行注释
compress 表示输出的css是压缩版的
注意正式环境关闭行注释
！ 注意文件修改后会自动编译，只需引入生成好的css即可，less文件错误是会有错误提示。
- 这样你就可以开调试时看到这样的
图片.png
less对应得位置
- 添加文件
图片.png
添加less文件夹到这里（添加按钮和拖拽都可以），右键可以重命名，方便分类
图片.png
右侧是文件列表，点击可以单独设置参数
图片.png
右键可以设置输出路径（默认是当前路径）
图片.png
三、less语法需注意的地方
- 完全支持css语法
-
可以引入less文件(文件可以省略.less)，模块化css开发
图片.png -
也可以引入css，文件必须加上.css
图片.png
*支持混合，可以这样写
图片.png - 定义变量
图片.png
调用变量，采用就近原则
图片.png
- 运算符要空空格
图片.png
更多用法可以参考：http://less.bootcss.com/functions/
图片.png
体验把css单做编程语言开发的乐趣吧，同时koala还可以压缩js，将多个js文件合并压缩为一个，减少http请求，用法
// @koala-prepend "xxx.js"为include包含js文件
