mac下使用webstorm监听less文件自动生成wxss文件

vscode可以使用 Easy LESS 插件实现通用的功能。

本机环境：

• 14.7.2 [macbookpro m3pro]
• WebStorm 2024.1.1
• nvm [v16.20.2]

步骤：

1. 全局安装 less，这里使用 3的版本 [注意：nvm管理，切换的时候，需要重新安装！]

npm uninstall -g less && npm install -g [email protected]

2. 打开 WebStorm 的 File Watcher

   ● 打开 WebStorm 设置（Cmd + , 或 File > Settings）。

   ● 找到 File Watchers（Tools > File Watchers）。

   ● 点击 + 添加新的 Watcher，选择 Less。

3. 配置 File Watcher

   在新建的 Less Watcher 里，修改如下配置：

   ● File type: Less

   ● Scope: Project Files

   ● Program: 填写 Less 运行路径，通常是：

   ○ lessc（如果是全局安装）

   ○ 或者填写项目中的 Less 位置，例如：node_modules/.bin/lessc

   ● Arguments: 修改为：

  $FileName$ $FileNameWithoutExtension$.wxss

● Output Paths:

$FileNameWithoutExtension$.wxss

● Working directory: $FileDir$（保持默认）