WebStorm原生支持Less语法高亮与编辑，无需插件；自动编译需配置File Watcher绑定lessc命令，并确保node/npm、全局less及路径正确。
WebStorm 本身不依赖“插件”来支持 Less 语法高亮或基础编辑——它原生支持 .less 文件的语法识别、变量提示、嵌套缩进、错误标记等。所谓“安装 Less 插件”，实际是混淆了两个概念：语法支持（开箱即用）和编译能力（需外部工具链）。你不需要装任何额外插件来写 Less，但要让它自动转成 CSS，得配 lessc 编译器。
WebStorm 原生支持 Less 语法，无需额外插件
只要你打开一个 test.less 文件，WebStorm 就会自动启用 Less 语言服务：支持 @variable 定义跳转、& 嵌套高亮、mixin 提示、括号匹配、错误 underline（比如漏了分号或括号不闭合）。这个能力来自内置的 language injection 和语法解析器，不是靠第三方插件提供。
验证方法：
– 新建文件，后缀名写 .less；
– 输入 @primary: #007bff;，看是否被识别为变量；
– 输入 .btn { &:hover { color: @primary; } }，看嵌套是否折叠/高亮正常。
如果没反应，检查：
– 文件后缀确实是 .less（不是 .css 或无后缀）；
– Settings → Editor → File Types 中，.less 是否被错误地关联到 Plain Text 或其他类型；
– 没手动禁用过 Less 相关的 language injection（Settings → Editor → Language Injections）。
要自动编译 Less，必须配置 File Watcher 而非插件
很多人搜“Less 插件”，其实是想点保存就生成 .css。这功能 WebStorm 不内置，得靠 File Watchers 绑定外部命令 lessc。关键不是装什么插件，而是确保三件事到位：
-
node和npm已安装（终端运行node -v和npm -v有输出） -
less全局安装：npm install -g less（完成后终端输入lessc -v应返回版本号） - WebStorm 的 File Watcher 正确指向
lessc可执行文件（Windows 下通常是lessc.cmd，路径类似C:\Users\XXX\AppData\Roaming\npm\lessc.cmd）
配置位置：File → Settings → Tools → File Watchers → + → Less。
重点填对两项：
– Program：选中 lessc.cmd 或 lessc 的绝对路径；
– Arguments：推荐用 --no-color $FileName$ $FileNameWithoutExtension$.css（避免 ANSI 颜色码干扰输出）。
常见失败原因：路径、权限、宏写法全错
配置完没反应？大概率卡在这几个地方：
- Windows 下误选了
lessc（无后缀），实际该选lessc.cmd；macOS/Linux 则选lessc（通常在/usr/local/bin/lessc或~/.npm-global/bin/lessc） -
Arguments里用了中文引号、全角空格，或把$FileName$写成$FileName（少个结尾$） - 全局安装
less后，lessc命令在终端可用，但 WebStorm 启动时没读取系统 PATH（尤其 macOS 用 zsh 启动 WebStorm 时更常见），此时必须填绝对路径，不能只写lessc -
Working directory设成了项目根目录以外的位置，导致@import相对路径找不到文件
调试技巧：
– 在 File Watchers 配置页勾选 Show console when error occurs；
– 改一行 Less 保存，看底部 Terminal 标签是否弹出错误；
– 错误信息里若含 command not found: lessc，就是路径或环境变量问题。
想压缩 CSS 或生成 source map？别碰插件，加参数就行
不需要装 “Less Compress 插件” 或 “SourceMap 插件”。lessc 自带这些能力，只要在 Arguments 里加对应 flag：
- 压缩：加
--clean-css（需先npm install -g less-plugin-clean-css） - 生成
.map：加--source-map=$FileNameWithoutExtension$.css.map - 同时压缩 + map：
--clean-css --source-map=$FileNameWithoutExtension$.min.css.map $FileName$ $FileNameWithoutExtension$.min.css
注意：--clean-css 是 lessc 的内置选项，但它依赖 less-plugin-clean-css 这个 npm 包——这是唯一需要额外 npm install 的东西，但它不是 WebStorm 插件，只是 lessc 的一个插件依赖。
真正容易被忽略的是：WebStorm 的 File Watcher 配置一旦保存，它就只对当前项目生效。换个项目，或者重装 WebStorm，这些配置不会自动同步。每次新建项目，你得重新确认 lessc 路径是否还有效——尤其是当你升级 Node.js 或改用 nvm/nvs 管理多版本时，lessc.cmd 的位置几乎必然变化。
