如何使用 angular-cli 调试 Angular2 中的应用程序?

2024-04-22

有谁知道是否可以通过命令行使用 angular-cli 来调试应用程序ng serve在网络风暴中?我尝试了此网址中发布的解决方案:

如何使用 Angular-CLI Webpack 调试 Angular 2 应用程序? https://stackoverflow.com/questions/39348213/how-to-debug-angular-2-app-using-angular-cli-webpack

但它对我不起作用,我决定做出一个新的答案,因为 Angular-cli 没有一些工具来做到这一点,这有点奇怪。


这是我使用 angular-cli (1.0.0-beta.21) 构建的 Angular2 (2.3) 项目的运行配置

需要检查的一些事项:

启动调试器并加载应用程序后,断点中是否显示复选标记?

如果没有,似乎由于某种原因未加载源映射。检查映射是否正确:打开http://localhost:4200/main.bundle.map在浏览器中,查看其中的 URL"sources":看起来像。如果你看到类似的东西

"webpack:////User/devuser/Develop/MyWebApp/src/app/index.ts"

那么 root 的 URL 映射将是

webpack:////User/devuser/Develop/MyWebApp

如果您发现使用了相对路径,请相应地更改 URL 映射。

如果最终您可以看到复选标记,请尝试刷新浏览器页面(重要的!!!) - 是否遇到任何断点?

如果您设法加载源映射(您可以看到复选标记,至少在浏览器刷新时命中了一些断点)-您就完成了:)您的 WebStorm 配置现在是正确的

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何使用 angular-cli 调试 Angular2 中的应用程序? 的相关文章

随机推荐