webStorm配置Less

Less作为作为一种动态样式语言,已经被广泛应用到实际开发中,大大的缩短了开发实际,提高了重用性和开发效率。但是,Less编译还是要耗费功夫的。本文主要介绍使用webStorm配置Less自动编译,在写Less的同时,编译出CSS。

1下载Less

准备工具:git,nodejs

Run git

执行如下代码

1
$ npm install -g less

2配置webStorm自动编译

Settings→Tools→FileWatchers
点击+,配置如下:

1
2
3
4
Program:Less的安装路径
Arguments:--no-color $FileName$
Working directory:$FileDir$
Output paths to refresh:$FileNameWithoutExtension$.css

OK,搞定。接下来在写Less文件的时候会在同一目录下自动编译出同名的CSS文件

扫一扫,请老师喝水