我有2个类似的项目在2个不同的笔记本电脑。第一个项目是用Angular 11编写的,并在开发者工具的源选项卡中使用WebPack云图标进行调试,这样我就可以找到源代码并设置断点。
使用Angular 12.0.1编写的第二个项目没有显示任何WebPack图标。我读过其他类似的问题,看起来angular.json有所有正确的开发设置(例如:sourceMap true,optimization false,defaultConfiguration development...),但它看起来仍然像Chrome开发工具中的生产版本。
我也尝试过做NG服务--配置开发
但还是没找到是否有什么我遗漏了,以便我可以调试V12项目?
6条答案
按热度按时间vx6bjr1n1#
我遇到了同样的问题,发现我必须向开发配置中添加sourceMap和优化条目。
构建使用:ng build --配置开发
现在对我很有效
dkqlctbz2#
我在将Angular 11应用程序更新到Angular 12(然后更新到13)后也遇到了同样的问题。我使用
ng serve
来调试我的angular代码。因此我不得不加上
在angular.json中的生产配置旁边的“serve”/“configuration”下。
现在我可以用
fzsnzjdm3#
当我们将angular从angular 11升级到以上版本时,就会出现这个问题。我们需要在angular.json文件中添加两个配置。
1.架构师>构建>配置>开发
1.架构师>构建>服务>配置>开发
}
ulydmbyx4#
我在一个Angular 13项目中遇到了这个问题,但在另一个项目中没有。事实证明,调试在localhost上不起作用,但在使用任何其他主机时都有效。
当我切换到“Angular Application”的调试窗口的“脚本”选项卡时,我开始怀疑,当我点击其中一个文件,例如:runtime.js,我会得到一个Connection refused消息:
解决办法是
1.设置域名,Map,例如“some.lan”到127.0.0.1。为此,您可以使用本地hosts文件(在Unix上,即/etc/hosts),或者在DNS服务器上设置它
1.编辑“Angular CLI Server”运行配置以使用参数
-- --host some.lan
(请不要跳过开头的附加内容!)1.编辑“Angular Application”运行配置以使用URL“http://some.lan:4200“
然后,像往常一样,首先 * 运行 * Angular CLI服务器(等待它完全加载),然后 * 调试 * Angular应用程序。
brccelvz5#
通过将它添加到angular.json文件中用于开发配置,我能够获得Angular 12版本的调试工作。
vptzau2j6#
我遇到了同样的问题,我用这种方式解决了它。
如果开发配置不存在,请在angular.json文件中添加以下配置到您的开发配置中,创建一个,该文件用于为您正在处理的项目配置angular。
您可以保持配置的其余部分不变。
除此之外,在底部加上
默认情况下,使用ng serve将只使用开发配置,但是如果您已经将默认配置指定为任何其他配置,则将被视为配置。
然后,您可以使用ngserve为您的应用程序提供服务,并且可以访问源文件