防止 vscode 节点调试器显示 node_modules 代码答案

【问题标题】：Prevent vscode node debugger from showing node_modules code防止 vscode 节点调试器显示 node_modules 代码
【发布时间】：2020-06-21 11:26:25
【问题描述】：

我正在尝试调试一个非常复杂的Angular 9 app in VSCode using Node Debugger, browser-preview and Debugger for Chrome，而将我引导至 node_module 内部代码的调试器不断让我发疯。

我尝试过同时使用Browser Preview: Launch 和ng serve with this VSCode skipFiles configuration 但第一个一直进入node_modules，而后者只是尝试启动Chrome在我取消调试过程之后。（这似乎是一个与当前主题完全无关的问题，但如果您愿意，我想对这部分提出任何意见）

我已经向browser-preview 扩展的制造商发送了一个问题，因为 VSCode 给了我一个带有skipFiles 的Property not allowed 警告。如果有人发现问题和/或对以下 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": [
        {
            "type": "browser-preview",
            "name": "Browser Preview: Attach",
            "request": "attach"
        },
        {
            "type": "browser-preview",
            "request": "launch",
            "preLaunchTask": "npm: start",
            "name": "Browser Preview: Launch",
            "url": "http://localhost:4200",
            "webRoot": "${workspaceFolder}",
            "skipFiles": [
                "${workspaceRoot}/node_modules/**/*.js",
                "<node_internals>/**/*.js"
            ]
        },
        {
            "name": "ng serve",
            "type": "chrome",
            "request": "launch",
            "preLaunchTask": "npm: start",
            "url": "http://localhost:4200/",
            "webRoot": "${workspaceFolder}",
            "skipFiles": [
                "${workspaceRoot}/node_modules/**/*.js",
                "<node_internals>/**/*.js"
            ],
            "sourceMapPathOverrides": {
                "webpack:/*": "${webRoot}/*",
                "/./*": "${webRoot}/*",
                "/src/*": "${webRoot}/*",
                "/*": "*",
                "/./~/*": "${webRoot}/node_modules/*"
            }
        }
    ]
}

编辑：我的目标是避免断点垃圾邮件，通过使用“Step Into (F11)”和“Step Over (F10)”逐行导航代码，并且“继续 (F5)" 以在需要时跳转到下一个断点。

【问题讨论】：

你可以试试"/node_modules/**/*.js" from github.com/microsoft/vscode-chrome-debug/issues/634
@Mark nope，“Step Over”和“Step Into”仍在进入 node_modules 代码（http、promise、observable 等）。

标签： node.js debugging visual-studio-code node-modules

【解决方案1】：

警告是 Typescript 级别的错误，它不会以任何方式影响编译。在使用以下依赖集对其进行彻底测试后，一切都按预期工作：

"@types/node": "^13.7.7",
"@angular/cli": "^9.0.5",
"@angular/compiler": "^9.0.5",
"@angular/compiler-cli": "^9.0.5",
"ts-node": "^8.6.2",
"tslint": "^6.0.0",
"typescript": "^3.7.5",
...

【讨论】：