使用 Visual Studio Code 调试 ExpressJS 服务器端代码

Posted 2023-02-15

【中文标题】使用 Visual Studio Code 调试 ExpressJS 服务器端代码

【英文标题】：Debug ExpressJS server side code using Visual Studio Code

【发布时间】：2016-09-16 06:05:55

【问题描述】：

我使用

制作了一个简单的 CRUD 应用程序 快递：4.13.4 吞咽：3.9.1 mongodb :v3.0.6 reactjs：15.0.2. 节点：4.0.0

对于服务器端代码，我听说可以通过 Visual Studio Code (v1.1.1.) 进行调试。

从 git bash 我通过 gulp serve 启动应用程序。但我不知道如何开始调试！

我的 gulp 任务的 sn-p。

gulp.task('serve',['bundle','start-server'],function()

    browserSync.init(
        proxy:'http://localhost:3000',
        port:9001
    );

);

当我们点击 VS Code 上的调试按钮启动调试界面时，我们会看到一个 launch.json ，其中我们有两个配置选项。

"version": "0.2.0",
"configurations": [
    
        "name": "Launch",
        "type": "node",
        "request": "launch",
        "program": "$workspaceRoot",
        "stopOnEntry": false,
        "args": [],
        "cwd": "$workspaceRoot",
        "preLaunchTask": null,
        "runtimeExecutable": null,
        "runtimeArgs": [
            "--nolazy"
        ],
        "env": 
            "NODE_ENV": "development"
        ,
        "externalConsole": false,
        "sourceMaps": false,
        "outDir": null
    ,
    
        "name": "Attach",
        "type": "node",
        "request": "attach",
        "port": 3000,
        "address": "localhost",
        "restart": false,
        "sourceMaps": false,
        "outDir": null,
        "localRoot": "$workspaceRoot",
        "remoteRoot": null
    
]

我猜这些是启动和附加配置。但是我们实际上如何通过调试启动 gulp。

我看到人们通过将“程序”键修改为"program": "/usr/local/bin/grunt" 来启动 grunt 进程。但似乎我无法为 gulp 做到这一点

即使我通过 git bash 启动了我的应用程序并尝试像提到的那样“附加”调试器 here ，vs 代码也只是显示一条错误消息说“已取消”！

TLDR；

当我们在 VS 代码中启动调试时，我们如何启动 gulp（或）grunt（或）启动服务器？ 是否可以通过 cmd 或 bash 从外部启动应用程序，并且仍然能够使用调试器调试服务器端代码？如果是这样，launch.json 中需要进行哪些更改？

【参考方案1】：

好吧，后来我终于通过启动和附加成功调试了许多书签和链接。

通过 launch 配置调试：

      
            "name": "Launch",
            "type": "node",
            "request": "launch",
            "program": "$workspaceRoot/server.js",
            "stopOnEntry": true,
            "args": [],
            "cwd": "$workspaceRoot",
            "preLaunchTask": null,
            "runtimeExecutable": null,
            "runtimeArgs": [
                "--nolazy"
            ],
            "env": 
                "NODE_ENV": "development"
            ,
            "externalConsole": false,
            "sourceMaps": false,
            "outDir": null
        

在 VSC 调试视图中按下绿色 > 按钮并在下拉菜单中选择启动选项，您应该会在 VSC 控制台中看到类似的内容。

node --debug-brk=21735 --nolazy server.js

调试器应该在 server.js 文件的第一行暂停。 用断点调试！ :)

通过 attach 配置调试：

       
            "name": "Attach",
            "type": "node",
            "request": "attach",
            "port": 5858,
            "address": "localhost",
            "restart": false,
            "sourceMaps": false,
            "outDir": null,
            "localRoot": "$workspaceRoot",
            "remoteRoot": null
        

从外部启动你的服务器

$node --debug-brk server.js

你的提示应该暂停在

Debugger listening on port 5858

按下 VSC 调试视图上的绿色 > 按钮，并在下拉列表中选择附加选项，调试器应自动附加自身并在 server.js 的第一行暂停

调试广告恶心

【讨论】：

如果一开始没有附加解决方案，请尝试刷新浏览器。 VS 代码还可以选择在屏幕底部自动附加。

outDir 现已弃用

什么是“从外部启动服务器”？

@TrietPham 附件 不 启动服务器，您必须手动执行此操作，例如npm run start 或类似内容，具体取决于您的脚本。

我觉得帖子里已经说过了：> $node --debug-brk server.js 有意义吗？