如何使用angular-cli在Angular2中调试应用程序？

Question

有没有人知道是否有可能通过命令行ng serve在WebStorm中使用angular-cli来调试应用程序？我试图张贴在这个网址的解决方案：

How to debug angular 2 app using angular-cli webpack?

但它并没有为我工作，我决定做一个新的答案，因为这是一个有点古怪的是角CLI不会有一些工具去做这个。

Answer 1

这里是与角CLI（1.0.0-beta.21）内置Angular2（2.3）的项目我的运行配置

有些事情要检查：

你有调试器启动并加载应用程序后，在断点中显示的复选标记？

如果没有，似乎源地图因某些原因未加载。检查映射是否正确：在浏览器中打开http://localhost:4200/main.bundle.map，查看"sources":中的网址。如果你看到像水木清华

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

那么对于根的URL映射将

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

如果你看到的相对路径的使用，改变URL映射相应。

如果终于可以看到复选标记，请尝试刷新浏览器页面（重要!!!） - 是否存在任何断点？

如果你能得到加载sourcemaps（你可以看到选中标记，至少一些断点被击中刷新浏览器） - 你做:)现在你WebStorm配置是正确的