VS 代码 - 在 2021 年运行调试(VS Code 1.60.0(用户设置))没有响应

Question

我在2020年建立了一个应用程序，现在我已经更新了所有的库，Visual Studio Code, npm, ng等。但是现在我不知道如何在MS代码中调试!

已经放弃了旧的调试器Chrome扩展，我生成了一个"附加到Chrome"one_answers"启动chrome"，我的印象是，我需要Launch，然后Attach点击绿色箭头与ng serve，它启动节点服务器

This is a simple server for use in testing or debugging Angular ...

它重建一切，以√ Compiled successfully.应用程序是在浏览器中。
调试工具栏显示在IDE中。

Call stack (LHS)显示(BugIcon) ng server:localhost:4200/# running在屏幕上的组件的方法中设置了断点，但是没有命中断点，并且断点保持未绑定状态。

现在，我不确定我应该点击什么来调试Run menu | Start Debugging似乎是可能的。不，它说的是"看起来浏览器已经从旧的调试会话运行了"。请关闭

也许切换运行和调试下拉到Attach to Chrome，点击绿色按钮得到一个(BugIcon) Attach to Chrome in the Call Stack但这最终会消失。我没有看到错误。

我的配置/启动等有问题吗?什么好主意吗?"附加到Chrome"中的9222端口是否正确?

自动生成的json文件到此为止。:(这是我的launch.json

{
// Use IntelliSense to learn about possible attributes.
// Hover to view descriptions of existing attributes.
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
"version": "0.2.0",
"configurations": [
{
"name": "Attach to Chrome",
"port": 9222,
"request": "attach",
"type": "pwa-chrome",
"webRoot": "${workspaceFolder}"
},
{
"name": "Launch Chrome",
"request": "launch",
"type": "pwa-chrome",
"url": "http://localhost:4200",
"webRoot": "${workspaceFolder}"
},

{
"name": "ng serve",
"type": "chrome",
"request": "launch",
"preLaunchTask": "npm: start",
"url": "http://localhost:4200/#",
"webRoot": "${workspaceFolder}",
"sourceMapPathOverrides": {
"webpack:/*": "${webRoot}/*",
"/./*": "${webRoot}/*",
"/src/*": "${webRoot}/*",
"/*": "*",
"/./~/*": "${webRoot}/node_modules/*"
}
},
...

编辑:至少我找到了一个解决方案;看到下面。

Answer 1

关机和重启VS Code

按照上面Panagiotis Bougioukos的建议使用命令。

> ng serve --optimization=false --sourceMap=true 
Option "optimization" is deprecated: Use the "optimization" option in the browser builder instead. 
Option "sourceMap" is deprecated: Use the "sourceMap" option in the browser builder instead. 

忽略警告，然后使用从下拉菜单中运行DEBUG命令(与最初生成的一样，请参阅原始问题)，然后点击绿色箭头。Launch Chrome

至少，我可以在IDE和浏览器中调试!!!!

错误/警告消息提示我在整个编译，构建和部署工具链中有一些工具不匹配，但我不知道是哪一个，也不知道如何找出不匹配的内容。