如何使用WebStorm IDE在Meteor应用程序中调试CoffeeScript

Question

我可以使用JavaScript在此问题（How can I debug my Meteor app using the WebStorm IDE?）中使用JavaScript在WebStorm中进行Meteor调试。

但是，我似乎无法在coffeescript文件中设置断点。

是否可以这样做？

Answer 1

我摆弄了一段时间没有取得任何成功。从我可以收集的信息来看，对于WebStorm支持coffeescript断点，它需要生成转换后的js和映射文件本身......这将打破流星，因为它会自己进行coffeescript编译。

最后，我得到的最接近的是：

1. 使用节点调试器选项运行meteor：

   $ NODE_OPTIONS =＆＃34; - debug = 47977＆＃34;流星

2. 在Webstorm中设置node.js远程调试配置，将其指向同一端口（47977）。

3. 启动调试会话

4. 在调试器＆＃34;脚本＆＃34;中显示的已编译的js文件中设置断点。标签。令人困惑的是，当在这些文件上设置断点时，我的WebStorm版本（8.0.4）没有在装订线中显示通常的红色圆圈图标......但它确实设置了断点并在那里中断。

所以不理想，但仍然比使用node-inspector更方便，更方便！

Answer 2

我终于明白了。

您已添加一个文件夹（在我的示例中为“.coffeejs”）来存储已转换的js和地图文件，请为此命名，但请记住使用“。”启动文件夹名称。对于Meteor的捆绑器来忽略其中的文件。

然后编辑watcherTasks.xml文件，您可以在项目根目录的.idea文件夹中找到该文件，并将'arguments'值更改为以下内容：

--output $ProjectFileDir$/.coffeejs/ --map --compile $FileName$

用咖啡享受流星！ ：）

Answer 3

@Sameer Shemma

你的工作技巧确实需要：

• 只添加这个新文件夹.coffeejs并更改单行 您在watcherTasks.xml文件或
中突出显示
• 替换你的整个watcherTasks.xml文件？

我尝试了第一种可能性，WebStorm仍然不会停留在.coffee文件中放置的大多数断点。

对于第二个我不知道在我的情况下名称属性的"/usr/local/bin/coffee"路径值的对应关系（Windows 7，Meteor 1.4.1.2，CoffeeScript包1.11.1_1，WebStorm 2016.2.3） ），但不改变这一点，WebStorm仍然不会停止放置.coffee文件的大多数断点。

另外，你的诀窍是否需要在我正在使用的Meteor CoffeeScript atomosphere包1.11.1_1中安装一个CoffeeScript文件观察器和/或独立编译器？

这是我当前的watcherTasks.xml文件：

<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
  <component name="ProjectTasksOptions">
    <TaskOptions isEnabled="true">
      <option name="arguments" value="--output $ProjectFileDir$/.coffeejs/ --map --compile $FileName$" />
      <option name="checkSyntaxErrors" value="true" />
      <option name="description" value="Compiles .coffee files into .js files" />
      <option name="exitCodeBehavior" value="ERROR" />
      <option name="fileExtension" value="coffee" />
      <option name="immediateSync" value="true" />
      <option name="name" value="CoffeeScript" />
      <option name="output" value="$FileNameWithoutExtension$.js:$FileNameWithoutExtension$.map:$FileNameWithoutExtension$.js.map" />
      <option name="outputFilters">
        <array />
      </option>
      <option name="outputFromStdout" value="false" />
      <option name="program" value="$ExecutableByFileExt$" />
      <option name="scopeName" value="Project Files" />
      <option name="trackOnlyRoot" value="true" />
      <option name="workingDir" value="$FileDir$" />
      <envs />
    </TaskOptions>
  </component>
</project>