Mac下使用IDEA如何安装less和sass并编译（局部/全局安装，IDEA自动编译）

这里我们是在一个项目下安装less，即局部less,这里给出在项目下安装less的过程。

1. 在IEDA的终端输入：npm install less
   这样就安装好了，可以在项目中看见less的目录
2. 接下来是编译less文件a.less，假设我们的less文件是在项目目录src的less目录下：
   执行： ./node_mudules/.bin/lessc ./src/less/a.less
3. 如果要生成对应的css文件：
   ./node_modules/.bin.lessc ./src/less/a.less>./src/css/a.css
   这里生成的css文件是在css目录下，如果不指定目录，默认生成在less文件下面，即：
   ./node_modules/.bin/lessc a.less>a.css
4. 全局执行只需要lessc命令即可

安装sass

sass的安装和less差不多，编译语法也差不多
安装： npm install node-sass
编译： ./node-modules/.bin/node-sass ./src/sass/a.scss>./src/css/a.css
或: ./node-modules/.bin.node-sass a.scss

全局安装

Mac下全局安装less或sass需要管理员权限sudo：
安装less： sudo npm install less -g
编译：lessc a.less

安装sass：sudo npm install node-sass -g
编译：node-sass a.scss

全局安装在任何项目下都可以使用，局部安装只在本项目下可以使用。

自动编译

IDEA下可以实现less和sass的自动编译，这里以less为例：
假设已经安装全局less:

1. 
2. 如果没有安装filewatchers，安装即可3. 这里已经添加了less，如果没有选择左下角的➕，添加less4.
3. 在program中添加less 的地址，不过这里会默认选择上，点击ok
4. 
   如图自动编译。