PhpStorm中CSSO File Watcher保存后报错求助

按照PhpStorm官方文档安装CSS压缩工具后，保存文件触发CSSO File Watcher时出现报错。执行的命令为：

cmd.exe /D /C call C:\Users\douglas\AppData\Roaming\npm\csso.cmd -i styles-rca.css -o styles-rca.min.css

报错信息：

C:\Users\douglas\AppData\Roaming\npm\node_modules\csso-cli\node_modules\clap\lib\index.js:1
import { basename, extname } from 'path';
   ^

SyntaxError: Unexpected token {
at Module._compile (internal/modules/cjs/loader.js:723:23)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:789:10)
at Module.load (internal/modules/cjs/loader.js:653:32)
at tryModuleLoad (internal/modules/cjs/loader.js:593:12)
at Function.Module._load (internal/modules/cjs/loader.js:585:3)
at Module.require (internal/modules/cjs/loader.js:692:17)
at require (internal/modules/cjs/helpers.js:25:18)
at Object.<anonymous> (C:\Users\douglas\AppData\Roaming\npm\node_modules\csso-cli\lib\index.js:3:13)
at Module._compile (internal/modules/cjs/loader.js:778:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:789:10)

Process finished with exit code 1

环境信息：PhpStorm 2022.2.3，csso-cli 4.0.1

这个报错是因为你的Node.js版本不支持ES模块的import语法。csso-cli 4.x版本依赖的clap库使用了ES模块语法，但当前运行csso的Node.js版本是基于CommonJS模块系统的旧版本（从报错里的internal/modules/cjs/loader.js可验证），无法识别import { ... } from 'path'这种写法。

方案1：升级Node.js版本 #

csso-cli 4.0.1要求Node.js版本至少为12.0.0，按以下步骤操作：

• 卸载当前旧版本Node.js
• 安装12.x或更高的LTS版本
• 重启PhpStorm后重新触发File Watcher测试

方案2：降级csso-cli到兼容旧Node的版本 #

如果暂时无法升级Node.js，可降级到使用CommonJS语法的csso-cli 3.x版本：

1. 打开命令提示符，执行卸载命令：

npm uninstall -g csso-cli

2. 安装指定兼容版本：

npm install -g csso-cli@3.5.1

3. 返回PhpStorm的File Watcher配置，确认命令路径指向正确的csso.cmd，重新测试保存压缩功能

方案3：检查PhpStorm的Node.js配置 #

确保PhpStorm使用的是新版Node.js：

1. 打开File > Settings > Languages & Frameworks > Node.js and NPM
2. 在Node interpreter下拉菜单中选择升级后的Node.js安装路径
3. 点击Apply保存配置后测试File Watcher

内容的提问来源于stack exchange，提问作者Douglas Vicentini