使用Visual Studio调试TypeScript代码

多发性硬化症

有没有一种方法可以在Visual Studio中调试TypeScript源(而不是调试生成的javascript)?

根据TypeScript语言规范:

TypeScript可以选择提供源映射,从而启用源级别的调试。

因此,我期望能够在ts代码中放置断点并能够对其进行调试,但这是行不通的。在规范中,我没有发现其他任何有关调试的信息。我应该做些什么来使这项工作吗?也许“可选地”一词暗示我需要做一些工作才能起作用……有什么建议吗?

裘德·费舍

VS2017及更高版本的当前答案

自VS2017开始,就可以直接在Visual Studio中调试Typescript。文档中

您可以使用Visual Studio调试JavaScript和TypeScript代码。您可以设置和达到断点,附加调试器,检查变量,查看调用堆栈以及使用其他调试功能。

在Visual Studio中还有关于调试Typescript / Asp.NET Core的其他资源

也可以在Visual Studio Code中调试打字稿

Visual Studio Code通过其内置的Node.js调试器以及通过诸如Debugger for Chrome之类的扩展支持TypeScript调试,以支持客户端TypeScript调试。

VS早期版本的原始答案:

您可能无法在VS中进行调试,但是可以在某些浏览器中进行调试。亚伦·鲍威尔(Aaron Powell)今天在博客中发布了有关在Chrome Canary中使用断点的信息:https : //www.aaron-powell.com/posts/2012-10-03-typescript-source-maps/

总结(非常简短)Aaron所说的话,您可以使用-sourcemap编译器上的开关在与*.js.map源文件相同的目录中生成文件。在支持源地图的浏览器中(Chrome Canary,以及可能是最新的Firefox构建,因为它们是Mozilla的想法),然后您可以.ts像正常.js文件一样调试

该博客以“希望Visual Studio或IE(或两者)团队还选择Source Maps并为其添加支持”结尾。-这表明还没有发生。

更新:

随着TypeScript 0.8.1的发布,Visual Studio现在也提供了源映射调试:

https://blogs.msdn.com/b/typescript/archive/2012/11/15/announcing-typescript-0-8-1.aspx

从公告中:

调试TypeScript现在支持源代码级调试!源地图格式已成为一种流行的调试语言的方法,该语言可翻译为JavaScript,并受各种浏览器和工具的支持。在0.8.1版中,TypeScript编译器正式支持源映射。此外,用于Visual Studio 2012的TypeScript的新版本支持使用源映射格式进行调试。现在,从命令行开始,我们完全支持使用--sourcemap标志,该标志输出与JavaScript输出相对应的源映射文件。此文件将允许在启用源地图的浏览器和Visual Studio中直接调试原始TypeScript源。要在Visual Studio中启用调试,请在使用TypeScript项目创建HTML应用程序后从下拉菜单中选择“调试”。

更新

WebStorm还增加了对通过SourceMaps进行调试的支持:http ://blog.jetbrains.com/webide/2013/03/webstorm-6-0-released-adds-typescript-debugging-with-source-maps-fresh-ui-以及更多/

首先,WebStorm允许使用TypeScript,CoffeeScript和Dart等现代语言进行更智能,更简化的Web开发。除了提供用于这些语言的一流代码编辑器之外,WebStorm 6还提供:

将这些高级语言自动编译/翻译为所有受支持平台上的浏览器识别的语言。使用源映射对TypeScript,Dart或CoffeeScript进行全功能调试。

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

Visual Studio代码-通过TypeScript调试Node JS

如何使用Visual Studio代码调试Django

使用Visual Studio代码调试节点8?

使用Visual Studio代码调试脚本

在Visual Studio代码中使用TypeScript和Webpack调试Node.js项目的正确方法

Visual Studio代码中Ionic2-Angular2应用程序的Typescript调试

如何使用节点js创建条件调试Visual Studio代码

使用Visual Studio代码调试Yeoman“无法启动程序...”

使用Visual Studio的Linux支持调试库代码

仅在使用Visual Studio调试时执行代码

使用Visual Studio调试时如何编辑代码?

使用 Visual Studio Code Ubuntu 调试 c++ 代码

使用Visual Studio Code调试并运行Angular2 Typescript?

使用Grunt / Gulp处理的文件在Visual Studio中调试TypeScript

在Visual Studio中调试exe代码

Visual Studio代码-调试生成的进程

需要Visual Studio代码配置以调试模具

无法在Visual Studio代码中调试Go

Visual Studio代码-无需ptvsd的远程调试

Visual Studio代码-开始调试操作

当 JavaScript 源代码位于不同文件夹时,如何在 Visual Studio Code 中调试 Node TypeScript

无法在 Visual Studio 代码中调试我的 C++ 代码

.Net Core Web Api项目无法使用Visual Studio代码进行调试

使用Visual Studio代码调试控制台时Chrome崩溃

在Visual Studio代码调试模式下使用Python Unittest运行单个测试

如何在Visual Studio Code中使用Django Shell调试Django(逻辑)代码

如何告诉Visual Studio使用其他源代码目录调试到库中?

Visual Studio无法使用调试器(AccessViolationException)。代码以随机顺序执行

使用python的Visual Studio代码