首先,需要保证电脑安装过Node.js,下载地址:https://nodejs.org/en/

安装Node.js的时候会自动安装npm

WebStorm怎么设置实现自动编译less文件

然后,安装lessc模块

打开cmd控制台

输入下面一行npm命令,安装less模块:-g是全局安装,如果不加会安装在当前目录。

npm install less -g

WebStorm怎么设置实现自动编译less文件

安装less-plugin-clean-css插件(less的插件,用于压缩代码)

npm install less-plugin-clean-css -g

WebStorm怎么设置实现自动编译less文件

PHPStorm 点击File>Settings>Tools>File Watcher 添加less自动编译参数

WebStorm怎么设置实现自动编译less文件

PhpStrom会自动识别lessc.cmd文件,如果不能识别,手动找到npm目录的lessc.cmd文件即可,我这里添加的--clean-css参数会自动代码压缩,也可以不加,就不会自动压缩代码了。

WebStorm怎么设置实现自动编译less文件

这样在项目里编辑less文件时,会自动时时生成css文件了

效果如下:

WebStorm怎么设置实现自动编译less文件

相关文章:

  • 2021-10-20
  • 2021-07-30
  • 2021-09-27
  • 2022-12-23
  • 2022-01-06
  • 2022-01-13
  • 2021-12-20
  • 2022-01-22
猜你喜欢
  • 2021-07-20
  • 2021-09-03
  • 2021-10-16
  • 2021-05-11
  • 2022-12-23
  • 2022-12-23
  • 2021-12-12
相关资源
相似解决方案