如何使用 VS Code - Debugger for Chrome 在 VSCode 中调试 Angular 多项目工作区?迁移到 Angular 多项目工作区后,调试不再起作用。如果我设置了断点,我会收到以下消息。
Breakpoint set but not yet bound
我找到了一个 blog post关于这个话题:"Visual Studio Code Breakpoints for Angular Multi-Project Workspace" .我在
launch.json
中添加了以下内容,我换了"webRoot": "${workspaceRoot}""
与 "webRoot": "${workspaceFolder}"
:{
"name": "Launch new-app in Chrome against localhost (with sourcemaps)",
"type": "chrome",
"request": "launch",
"runtimeExecutable": "/usr/bin/chromium-browser",
"runtimeArgs": [
"--disable-extensions"
],
"url": "http://localhost:4200",
"webRoot": "${workspaceFolder}",
"sourceMaps": true,
"sourceMapPathOverrides": {
"/./*": "${webRoot}/projects/new-app/*",
"/src/*": "${webRoot}/projects/new-app/src/*",
"/*": "*",
"/./~/*": "${webRoot}/node_modules/*",
},
}
我也换了
new-app
使用正确的应用程序名称,但它仍然不起作用。文件夹结构:
谁能帮我解决这个问题?
最佳答案
我通过使用 .scripts
来完成这项工作命令找出 sourceMapPathOverrides
的正确路径属性(property)。
{
"name": "Launch editor in Chrome against localhost (with sourcemaps)",
"type": "chrome",
"request": "launch",
"runtimeExecutable": "/usr/bin/chromium-browser",
"runtimeArgs": [
"--disable-extensions"
],
"url": "http://localhost:4200",
"webRoot": "${workspaceFolder}",
"sourceMaps": true,
"sourceMapPathOverrides": {
"webpack:/*": "${webRoot}/projects/apps/editor/*",
"webpack:///./src/*": "${webRoot}/projects/apps/editor/src/*",
"/*": "*",
"/./~/*": "${webRoot}/node_modules/*",
},
}
关于angular - 如何在 Visual Studio Code 中调试 Angular 多项目工作区,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58780327/