【笔记】IDEA自动编译Less代码为CSS文件
前言
IDEA自动编译Less代码为CSS文件
下载Less
Npm
1 | npm install less -g |
下载插件
Plugins->File Watchers->Install如果是新版本
WebStorm则自带File Watchers插件无需重复下载
修改设置让Less代码自动编译
IntelliJ IDEA->Settings->Tools->File Watchers->+->Less将
Program配置为lessc所在路径->OK->OK
MacOS上的可执行文件所在路径:/opt/homebrew/lib/node_modules/less/bin/lessc
完成
- 重新编辑
.less文件并保存,此时会自动在.less同级目录下生成.css文件和.css.map文件
踩坑
- 报错:
/opt/homebrew/lib/node_modules/less/bin/lessc index.less index.css --source-map env: node: No such file or directory
原因
- IDEA中的环境变量不包含Brew的bin目录,无法在系统的环境变量中找到node命令
解决问题
- 在系统环境变量的
PATH末尾追加:/opt/homebrew/bin
