CoffeeScript
借助 WebStorm，您可以使用可编译为 JavaScript 的 CoffeeScript。 WebStorm 会识别 *.coffee 文件，并使用 
对其进行标记。 您可以直接在 CoffeeScript 代码中设置断点，WebStorm 会通过编译期间生成的 source map 识别这些断点。
WebStorm 可通过为关键字、标签、变量、参数和函数提供补全建议，帮助您编写 CoffeeScript 代码。 您可以使用 Ctrl+B 跳转到符号的声明处，或使用 Ctrl+Alt+B 跳转到其实现处，以及使用 Ctrl+Alt+Shift+N 按名称查找任意符号。
WebStorm 与 coffeescript 编译器集成，可将 CoffeeScript 代码转换为 JavaScript。 该工具还会生成 source maps ，建立 CoffeeScript 与生成的 JavaScript 代码之间各行的对应关系，以便 WebStorm 调试器识别断点并正确处理。
开始之前
请确保您的计算机上已安装 Node.js。
请在 设置 | 插件 页签的 Marketplace 标签页上安装并启用 CoffeeScript 插件，具体步骤请参阅 从 JetBrains Marketplace 安装插件。
请确保在设置中启用了 File Watchers 插件。 按 Ctrl+Alt+S 打开设置，然后选择 。 单击 已安装 标签页。 在搜索框中输入 File Watchers。 如需了解插件相关信息，请参阅 管理插件。
将 CoffeeScript 编译为 JavaScript
若要自动编译代码，您需要配置一个 CoffeeScript File Watcher ，以便跟踪文件更改并运行编译器。
当您打开文件时，WebStorm 会检查当前项目中是否存在适用的 File Watcher。 如果配置了 File Watcher 但未启用，WebStorm 会显示一个弹窗，通知您相关配置并建议启用该 File Watcher。
如果当前项目中已配置并启用了适用的 File Watcher，WebStorm 会在 New Watcher dialog 中指定的事件触发时自动启动编译器。
如果选中 自动保存已编辑文件以触发监视器 复选框，则在对源代码进行任何更改后将立即触发 File Watcher。
如果未选中 自动保存已编辑文件以触发监视器 复选框，则 File Watcher 将在保存（、 Ctrl+S ）时或将焦点从 WebStorm 移开时（窗口失焦）启动。
详细信息请参阅 文件监视器。
编译器会将生成的输出存储在单独的文件中。 该文件名称与源 CoffeeScript 文件相同，扩展名因编译器类型而异，为 .js 或 .js.map 。 生成文件的位置由 需刷新的输出路径 字段中的设置决定，该字段位于 New Watcher dialog 中。 根据该设置，WebStorm 可识别编译器输出。 但是，在 项目 工具窗口 Alt+1 中，它们显示在源 coffee 文件下方，该文件现在显示为一个节点。
安装 CoffeeScript 编译器
在嵌入式 终端 （Alt+F12 ）中，输入以下命令之一：
npm install --global coffeescript以进行全局安装。npm install --save-dev coffeescript以将 CoffeeScript 安装为 开发依赖项。请参阅 CoffeeScript 官方网站 了解更多信息。
创建 CoffeeScript File Watcher
按 Ctrl+Alt+S 打开设置，然后选择 。
单击
或按 Alt+Insert ，然后在列表中选择 CoffeeScript 预定义模板。 您的代码将被转换为 JavaScript，并附带生成的 source maps。按照 文件监视器 中的说明操作。
自定义编译器行为
使用 WebStorm，您可以通过向编译器传递参数来进行调整，就像在命令行模式下工作一样。 以下是自定义 CoffeeScript 编译器默认输出位置的示例。
假设项目的文件夹结构如下所示：
使用默认的 File Watcher 时，生成的文件将作为原始文件的子项显示。
您可以更改此默认位置，并将生成的文件存储在单独的 JavaScript 文件夹中。
将所有生成的文件存储在输出 JavaScript 文件夹中
在 参数 字段中输入：
--map --compile -o $ProjectFileDir$/JavaScript $FileName$在 需刷新的输出路径 字段中输入：
$ProjectFileDir$/JavaScript/$FileNameWithoutExtension$.js:$ProjectFileDir$/JavaScript/$FileNameWithoutExtension$.map:$FileNameWithoutExtension$.js.map
结果，项目树如下所示：
您还可以将生成的文件存储在在 app 节点下重复原始结构的文件夹结构中。
在输出文件夹中保留原始文件夹结构
创建 CoffeeScript File Watcher。
在 参数 字段中输入：
--map --compile -o $ProjectFileDir$/JavaScript/$FileDirRelativeToProjectRoot$ $FileName$在 需刷新的输出路径 字段中输入：
$ProjectFileDir$/JavaScript/$FileDirRelativeToProjectRoot$/$FileNameWithoutExtension$.js:$ProjectFileDir$/JavaScript/$FileDirRelativeToProjectRoot$/$FileNameWithoutExtension$.map:$FileNameWithoutExtension$.js.map
结果，项目树如下所示：
在不运行编译器的情况下预览编译结果
WebStorm 可以在不实际运行编译器的情况下对 CoffeeScript 代码执行静态分析，并在专用的只读查看器中显示预测的编译输出。
在编辑器中打开所需的 CoffeeScript 文件，然后右键单击编辑器背景。
在上下文菜单中选择 。 预览将在专用的只读查看器中打开：左窗格显示原始 CoffeeScript 源代码，右窗格显示编译器运行时将生成的 JavaScript 代码。
运行 CoffeeScript
在 WebStorm 中运行 CoffeeScript 有两种方式：
手动编译 CoffeeScript 代码，然后像运行 Node.js 应用程序一样运行生成的 JavaScript 代码。
通过 Node.js 运行配置运行原始 CoffeeScript 代码，由 WebStorm 实时编译。
手动编译 CoffeeScript 并运行生成的 JavaScript 代码
开始创建 Node.js 运行配置 ，并设置以下必填项：
要使用的 Node.js 引擎。 默认情况下，该字段显示的是在进行 Node.js 配置时在 Node.js 页面中指定的解释器路径。
在 工作目录 字段中，指定从要运行的起始 CoffeeScript 文件所引用文件的位置，例如 includes。 如果该文件未引用任何其他文件，请将该字段留空。
在 Node 应用 JS 文件路径 字段中，指定在编译过程中从原始 CoffeeScript 文件生成的 JavaScript 文件的完整路径。
保存配置后，在对话框中单击 运行。
或者，从主工具栏的列表中选择新创建的运行配置，然后单击
。按照 运行 Node.js 应用程序 的方式继续。
运行时即时编译 CoffeeScript
此模式要求 register.js 文件（属于
coffeescript包的一部分）位于项目中。 因此，请确保已按照 安装 CoffeeScript 编译器 中所述在本地安装了coffeescript包。在编辑器中打开起始 CoffeeScript 文件，或者在 项目 工具窗口中选择 Alt+1 ，然后从上下文菜单中选择 。 WebStorm 使用自动生成的运行/调试配置运行该文件。
或者，从上下文菜单中选择 ，然后在打开的 运行/调试配置：Node.js 对话框中检查以下必填项：
保存配置后，在工具栏上单击
。或者，从主工具栏的列表中选择新创建的运行配置，然后单击
。按照 运行 Node.js 应用程序 的方式继续。
调试 CoffeeScript
若要在 WebStorm 中调试 CoffeeScript，必须生成 source maps （源映射）作为 JavaScript 代码的补充。 source maps 将 CoffeeScript 代码与生成的 JavaScript 代码中的行一一对应，否则断点将无法识别并正确处理。 通过使用类型为 CoffeeScript 的 File Watcher 手动编译 CoffeeScript 代码，可以生成 JavaScript 和 source maps。之后，您可以像调试 Node.js 应用程序一样调试输出的 JavaScript 代码。 之后，您可以像调试 Node.js 应用程序一样调试输出的 JavaScript 代码。
仅在 本地模式下支持调试 CoffeeScript。 这意味着，WebStorm 会根据运行配置自行启动 Node.js 引擎和目标应用程序，并完全控制调试会话。
有关调试 Node.js 应用程序的更多信息，请参阅 运行与调试 Node.js。
调试 CoffeeScript 代码
在需要的 CoffeeScript 代码位置设置 断点。
使用类型为 CoffeeScript 的 File Watcher 将 CoffeeScript 代码 编译为 Javascript。
通过以下必要设置 开始创建 Node.js 运行配置：
要使用的 Node.js 引擎。 默认情况下，该字段会显示在 Node.js 配置期间的 Node.js 页面中指定的解释器路径。
在 工作目录 字段中，指定从要运行的起始 CoffeeScript 文件引用的文件位置，例如 includes。 如果该文件未引用其他文件，只需将该字段留空即可。
在 Node 应用 JS 文件路径 字段中，指定编译过程中从原始 CoffeeScript 文件生成的 JavaScript 文件的完整路径。
保存配置后，单击工具栏中的
。与 在本地启动带有 Node.js 应用程序的调试器时的操作方式相同。
配置语法高亮
您可以根据自己的习惯和偏好配置支持 CoffeeScript 的语法高亮。
在 设置 对话框（Ctrl+Alt+S ）中，转到 。
选择配色方案，接受默认继承的高亮设置或按照 颜色和字体 中所述进行自定义。