每次在.ts文件中添加断点时，Chrome都会在main.bundle.ts中打开相应的行

Question

I'm developing an Angular (v4.3.5) SPA, serving it with Angular CLI's ng serve command and debugging it through Chrome Developer Tools. Last week something strange started to happen and I can't seem to do anything to change it to the way it was before: in Chrome Dev Tools, when I click on the line number to add a breakpoint in my .ts files, Chrome Dev Tools also open the corresponding line in main.bundle.ts , so now every single time I add a breakpoint I have to close main.bundle.ts or click back on the title of .ts file. It's very annoying. Is there a new change in default settings or something? Because I couldn't find anything related to that (although I'm not even sure how to google this issue...)

So my question is: what can I do to force Chrome not to open main.bundle.ts every time I add a breakpoint?

EDIT: I just found out this issue happens only when I run ng serve from Visual Studio Code terminal.

Answer 1

This worked for me (chromeDevTools):

Map webpack://./ to / in your project workspace

Answer 2

看起来这是一个Chrome错误 - 将其更新到版本61.0.3163.79解决了我的问题。