如何使用 Visual Studio（如 IE）在 Chrome 中获得完整的 JavaScript/TypeScript 调试答案

【问题标题】：How to Get Full JavaScript/TypeScript Debugging in Chrome with Visual Studio (Like IE)如何使用 Visual Studio（如 IE）在 Chrome 中获得完整的 JavaScript/TypeScript 调试
【发布时间】：2015-06-08 16:10:53
【问题描述】：

是否有一种方法可以在 Visual Studio 中使用 Chrome 交互式调试 JavaScript 和 TypeScript，类似于当前 Internet Explorer 提供的功能？使用 IE，我可以在 IDE 中的 JavaScript 或 TypeScript 中设置断点，并单步执行 IDE 中的代码。我无法在 Visual Studio 中使用 Chrome 获得相同的行为。

【问题讨论】：

使用 Visual Studio 2013 社区
对我来说只有 IE 11 可以正常工作
更新：Visual Studio Code (VSCODE) 现在支持使用 Chrome 进行全面调试，具有令人难以置信的性能。而且，在最新版本中，它支持选项卡式 UI，恕我直言，它与 Visual Studio 2015 一样可用。
@ASA2 在哪里可以找到带有 Chrome 指令的 VSCODE 调试？我一直在谷歌搜索，但到目前为止还没有运气。谢谢！
转到 VSCODE 的扩展面板（侧面）并搜索“Debugger for Chrome”。另请参阅：code.visualstudio.com/blogs/2016/02/23/…

标签： javascript google-chrome debugging visual-studio-2013 typescript

【解决方案1】：

要获得与任何基于 JavaScript/浏览器的应用程序和 Visual Studio 的完全集成调试体验，您现在需要使用 Internet Explorer。由于 TypeScript 编译为 JavaScript，集成调试也需要 Internet Explorer。

如果我想使用另一个浏览器，我经常使用的“技巧”是在我的 TypeScript/JavaScript 代码中的某处添加 debugger; 语句，并在 Chrome 中打开开发工具......然后执行将停止那条指令。只要您启用了源映射，您就应该在 Chrome 调试窗口中看到您的原始 TypeScript 代码。然后，您可以使用 Chrome 调试工具设置更多断点。如果文件没有改变，断点将从页面的“刷新”中保留。

虽然这不允许我在 Visual Studio 中设置断点，但它仍然有效，并且对我的开发工作足够好。

2016 年 4 月更新

正如 cmets 中的一些人所指出的，有一条途径可以使这项工作变得更好一些，尽管这种体验不如 Internet Explorer 那样完整。按照here 列出的步骤进行操作。它涉及使用自定义命令行启动 Chrome（以启用远程调试）：

chrome.exe --remote-debugging-port=9222

然后在启用 WebKit 调试的情况下附加到 Chrome 进程。您可以添加自定义浏览器以轻松启动 Chrome。

（但是，我要补充一点，我无法让它以我认为有用且一致的方式工作，尤其是当我使用 Chrome 浏览大多数其他网页时。）

【讨论】：

我发现 VS 是 JS/TS 交互性最强的 IDE。提供类似级别的交互式调试的任何其他 IDE？网络风暴？
WebStorm 声称可以通过 Chrome 的插件来工作，但我从来没有发现它在我可以依赖它的地方足够稳定地工作。所以，我不使用它。
这个答案仍然正确吗？
看来可以使用远程调试了：lostindetails.com/blog/post/…
如果您已经启动了任何没有远程调试标志的 chrome.exe 进程，您必须先关闭它们，否则使用此选项启动将在现有主机和调试器中创建一个新选项卡将无法附加。因为我使用 chrome 作为我的主要浏览器，所以这个让我绊倒了一段时间，所以它通常已经打开了