WebStorm 要正确运行 CoffeeScript，必须配置 Node.js 环境、全局可用的 coffeescript 命令行工具（npm install -g coffeescript），以及含 -c -m 参数和正确 Output paths 的 File Watcher；缺一将导致无 JS 输出或断点失效。
WebStorm 能直接运行 CoffeeScript，但必须手动配齐三样东西：Node.js 环境、coffeescript 命令行工具、以及一个正确参数的 File Watcher。缺任何一环，都会表现为“改了 .coffee 文件没生成 .js”或“断点灰色不可用”。
确认 coffee 命令全局可用
WebStorm 的 File Watcher 本质是调系统命令，它不认 npm run coffee 或 package.json 脚本，只认终端里能直接敲出结果的 coffee。
- 在终端执行
coffee -v，必须返回版本号（如1.12.7），否则 Watcher 启动时静默失败，无报错提示 - 推荐用
npm install -g coffeescript（注意不是coffee-script，新版本已弃用该包名） - Windows 用户若用 npm 全局安装后仍找不到
coffee，检查%APPDATA%\npm是否在系统 PATH 中 - Mac/Linux 用户若装在
/usr/local/bin外路径（比如 nvm 管理），需在 WebStorm 的Settings → Tools → Terminal中设置 Shell path，确保终端环境一致
配置 CoffeeScript File Watcher 的关键参数
默认新建的 CoffeeScript Watcher 很可能编译失败，因为它的 Arguments 和 Output paths to refresh 是通用模板，不匹配实际项目结构。
-
Program：指向coffee可执行文件绝对路径（如/usr/local/bin/coffee），别用 “Bundled” 或留空 -
Arguments：必须包含-c -m $FileName$——-c表示编译，-m表示生成 source map；漏掉-m就无法在 .coffee 里打断点 -
Output paths to refresh：填$FileNameWithoutExtension$.js，不能写成$FileDir$/...，否则 WebStorm 找不到输出文件，source map 关联失效 -
Working directory：设为$ProjectFileDir$，确保coffee在项目根目录下执行，能正确读取coffee.json（如有）
调试时断点不命中？先查这三处
断点变灰色、点击无效、控制台显示“no executable code found”，基本不是 CoffeeScript 语法问题，而是 source map 链路断了。
- 检查生成的
.js文件末尾是否有//# sourceMappingURL=xxx.js.map—— 没这行，浏览器和 WebStorm 都无法关联源码 - 检查
.js.map文件是否真实生成，且与.js同目录；如果 Watcher 输出路径设错，map 文件可能被写到别的地方 - Chrome/Firefox DevTools 设置里必须开启
Enable JavaScript source maps（在 Settings → Preferences → Debugger 下） - WebStorm 调试配置中，
JavaScript Debug的 URL 必须指向 HTML 页面（含生成的.js），不能指向.coffee文件本身
最容易被忽略的是：coffee 命令版本与 WebStorm 插件兼容性。2026 年主流用的是 coffeescript@2.7.0+，它不再支持 --bare 等旧参数，而某些 WebStorm 内置模板仍带过时选项。一旦参数冲突，Watcher 就会退出码 1 且不报错——你得手动在 Settings → Tools → File Watchers 里勾选 “Show console when warnings or errors occur”，才能看到真实错误输出。
