debugging 在WebStorm 7中调试时未命中Typescript断点

9jyewag0  于 12个月前  发布在  Storm
关注(0)|答案(2)|浏览(246)

我使用Typescript SDK 0.9.1.1和WebStorm 7。我有一个.ts文件,文件监视器转译其.js和源Map文件。我也有一个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)并返回该数字加1。我的页面,javascript和Typescript工作正常,因为页面在加载时显示为“6”。
我可以在.js文件中设置断点,它们会被命中(显示Typescript文件的等效行),但如果我在原始.ts文件中设置断点,它们就不会被命中。我搜索过这个问题,但我的问题似乎与其他人的不同-我在本地运行(而不是远程),我在WebStorm中设置断点,而不是Chrome的调试视图。
在WebStorm中,脚本选项卡仅显示.js和.html文件。我应该在这里看到更多吗?如果这就是问题所在,我该怎么解决?我已经打开了调试配置,但我看不到在那里添加.ts文件的方法。

1qczuiv0

1qczuiv01#

你们中的一些人可能已经从Google结束了:
我所要做的就是确保在我的tsConfig.json中将sourceMap设置为true,如下所示:

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

rdlzhqv92#

这是由于WebStorm中的open bug。实际上,解决方法是从浏览器重新加载HTML页面(这与从WebStorm在调试模式下重新运行HTML页面不同)。如果您这样做,那么.ts文件中的断点将被命中。

相关问题