webstorm下搭建编译less环境 以及设置压缩css

webstorm自带less，不过要编译的话需要nodejs环境。

1. 首先去node的主页下载对应版本的nodejs然后安装，下载地址：http://nodejs.org/
2. 安装完之后打开命令提示符（win+r）,分别输入node -v以及npm -v如果返回版本号说明你安装成功了。
3. 接下来就可以安装less了，命令提示符npm进入npm管理器，然后npm -g install less开始下载less，默认安装目录在用户名\node_modules这里面。复制红框中的路径
4. 
5. 到这里less安装完毕了，接下来配置webstorm。
6. 打开webstorm的file->settings ->External Tools，点击左上角的“加号”标志add，进入对话框
7. 
8. program里设置的是lessc的路径，这里的目录可以参考截图中红框中的目录，他会默认编译到根目录。例如：/Users/xx/node_modules/less/bin/lessc
9. 如果你想顺便压缩编译后的css，除了在Arguments中写入--plugin=less-plugin-clean-css外还要安装压缩插件：npm install -g less-plugin-clean-css，这里要注意我安装的路径，如果最后less-plugin-clean-css的路径和上边的/Users/xx/node_modules/less不一个路径的话也跑步起来，这样怎么解决呢，可以直接将clean-css路径中的less-plugin-clean-css文件夹copy到/Users/xx/node_modules/中搞定
10. 然后你可以为这个编译器指定一个快捷键，我使用的是ALT + B ，（注意：这一步可以省略，因为直接保存就编译了）
11. 
12. 之后打开一个.less后缀名的文件，快捷键编译，如果webstorm底部状态控制器显示 Process finished with exit code 0 ，那么恭喜你，大功告成！