【笔记】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