在 WebStorm 7 中调试时没有命中 Typescript 断点答案

【问题标题】：Typescript breakpoints not hit when debugging in WebStorm 7在 WebStorm 7 中调试时没有命中 Typescript 断点
【发布时间】：2013-10-11 17:53:48
【问题描述】：

我正在使用 Typescript SDK 0.9.1.1 和 WebStorm 7。我有一个 .ts 文件，其中包含一个文件观察器，用于转换其 .js 和 sourcemap 文件。我也有一个看起来像这样的 HTML 文件...

<!DOCTYPE html>
<html>
<head></head>
<body>
    <p id="output">5</p>
    <script src="HelloWorld.js"></script>
    <script>
        var u = new Utils();
        document.getElementById('output').innerHTML = u.plusOne(5);
    </script>
</body>
</html>

plusOne 函数只接受数字（在本例中为 5）并返回该数字加一。我的页面、javascript 和 Typescript 工作正常，因为页面加载时显示“6”。

我可以在 .js 文件中设置断点并且它们会被命中（向我展示 Typescript 文件的等效行），但如果我在原始 .ts 文件中设置断点，它们不会。我已经搜索过这个问题，但我的问题似乎与其他问题不同 - 我在本地（不是远程）运行，我在 WebStorm 中设置断点，而不是在 Chrome 的调试视图中。

在 WebStorm 中，脚本选项卡仅显示 .js 和 .html 文件。我应该在这里看到更多吗？如果这是问题所在，我该如何解决？我已经打开了调试配置，但我没有看到添加 .ts 文件的方法。

【问题讨论】：

标签： debugging typescript breakpoints webstorm

【解决方案1】：

致那些通过 Google 来到这里的人：

我所要做的就是确保在我的tsConfig.json 中将sourceMap 设置为true，如下所示：

{
  ...
  "compilerOptions": {
    ...
    "sourceMap": true,
    ...
  },
  ...
}

【讨论】：

【解决方案2】：

原来这是由于 WebStorm 中的 open bug。实际上，解决方法是从浏览器重新加载 HTML 页面（这与从 WebStorm 在调试模式下重新运行 HTML 页面不同）。如果你这样做了，那么 .ts 文件中的断点就会被命中。

【讨论】：

hmm 这里有同样的问题，但没有让它工作。我让 Webstorm 完全停止的唯一方法是输入“debugger;”在代码中，但这仍然只将我带到 .js 文件，而不是 .ts