使用Google Chrome在WebStorm中调试JavaScript Angular应用程序

Question

我正在尝试使用Google Chrome在WebStorm中的Angular应用程序中调试一些控制器代码。

我的调试设置：

运行这些调试设置时：

1）Chorme在任务栏中闪烁，好像它正在尝试连接一样。

2）我不看到通常显示在页面顶部的调试标签（指示）（如褐色标题）

3）在WebStorm的Debugger窗口中，我收到以下消息

 "cannot connect , ensure that Web Inspector is closed "

此外，我还可以使用Chrome开发工具调试我的代码。

知道什么阻碍了Webstorm的调试器连接到Chrome？

Answer 1

你安装了＃34; JetBrains IDE支持＆＃34;铬的延伸？ 如果您的Web服务器在localhost：63342中运行，请尝试：

1. 将URL参数设置为http：// localhost：63342
2. 将index.html文件绑定到http：// localhost：63342 / index.html

如果您有任何疑问，请查看这篇文章，其中介绍了如何使用Intellij调试Angular，一步一步： http://ignaciosuay.com/how-to-debug-angularjs-with-intellij/

Answer 2

我遇到了和你一样的问题，但是我找到了解决方案。你只是缺少一个简单但重要的步骤，即覆盖默认的CORS设置。你可以按照：

1. 右键单击JetBrains Chrome扩展程序图标，然后选择选项 在上下文菜单上。将打开包含Chrome扩展程序选项的网页 显示连接到WebStorm的参数。
2. 更改您在WebStorm中可以找到的端口。然后，您可以 在Chrome中调试AngularJS应用程序。

您还可以看到https://www.jetbrains.com/webstorm/help/using-jetbrains-chrome-extension.html

Answer 3

首先检查你的chrome上的Jetbrains IDE支持安装，然后右键单击图标转到选项检查端口，我在我的角应用程序中使用路由，因此在webstorm javascript调试的URL中没有选择特定的html文件，例如（{ {3}}）在urlbox上写入然后控制器中的断点工作。这个解决方案对我有用