如何在我的项目中使用Chrome调试Angular * ngIf结构化指令? [英] How to debug Angular *ngIf structural directive using Chrome within my project?
问题描述
我想将Angular源代码/源映射附加到生成的Angular CLI项目中,以便可以在Chrome中调试*ngIf
之类的指令.
I would like to attach Angular source code / source map to my generated Angular CLI project, so that I can debug directives like *ngIf
in Chrome.
是否可以使用一些angular.json配置/源映射以某种方式将调试器附加到ng_if.ts
中?
还是有一个设置可以在开发模式下添加源地图,以便我可以逐步浏览附加了源地图的第3方库?
Is it possible to somehow attach debugger into ng_if.ts
using some angular.json configuration / source map ...?
Or is there a setting to add source map in develop mode so that I can step through any 3rd party library with source map attached?
如果我在Chrome中按 Ctrl + O ,然后键入ngIf
或ng_if
,则列表菜单中没有此类文件.
If I press Ctrl + O in Chrome and then type ngIf
or ng_if
there is no such file in the list menu.
提供供应商源地图时的外观(请参见已接受的答案):
推荐答案
这也让我感到好奇.我从不需要调试有角度的源代码,但是为什么不呢?
This made me curious as well. I never did need to debug angular source code, but why not.
似乎在某个时候不推荐使用ng cli的vendorSourceMap
标志,而新的实现方式是通过v7.2以后的angular.json
文件( https://blog.ninja-squad.com/2019/01/09/angular-cli- 7.2/):
It seems there was a vendorSourceMap
flag for the ng cli that was deprecated at some point and the new way of doing this is via the angular.json
file since v7.2 (https://blog.ninja-squad.com/2019/01/09/angular-cli-7.2/):
"serve": {
"options": {
"sourceMap": {
"scripts": true,
"styles": true,
"vendor": true
},
...
}
这篇关于如何在我的项目中使用Chrome调试Angular * ngIf结构化指令?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!