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

sem*_*boi 5 debugging express gulp visual-studio-code vscode-debugger

我使用了一个简单的CRUD应用程序

  • 表达:4.13.4
  • gulp: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任务的片段.

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

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

});
Run Code Online (Sandbox Code Playgroud)

当我们单击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
    }
]
Run Code Online (Sandbox Code Playgroud)

}

我猜这些是启动和附加配置.但是我们如何通过调试来实现这一目标.

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

即使我已经通过git bash启动我的应用程序并尝试"附加" 此处提到的调试器,vs代码只显示一条错误消息,说"已取消"!

TLDR;

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

sem*_*boi 15

Allrighty,众多书签和链接后来我终于成功通过启动和附加进行调试.

通过启动配置调试:

      {
            "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
        }
Run Code Online (Sandbox Code Playgroud)

按下VSC调试视图上的绿色>按钮,并在下拉列表中选择启动选项,您应该在VSC控制台中看到类似的内容.

node --debug-brk=21735 --nolazy server.js
Run Code Online (Sandbox Code Playgroud)

并且调试器应该在server.js文件的第一行暂停.使用断点进行调试!:)

通过附件配置调试:

       {
            "name": "Attach",
            "type": "node",
            "request": "attach",
            "port": 5858,
            "address": "localhost",
            "restart": false,
            "sourceMaps": false,
            "outDir": null,
            "localRoot": "${workspaceRoot}",
            "remoteRoot": null
        }
Run Code Online (Sandbox Code Playgroud)

从外部启动服务器

$node --debug-brk server.js
Run Code Online (Sandbox Code Playgroud)

你提示应该暂停

Debugger listening on port 5858
Run Code Online (Sandbox Code Playgroud)

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

调试广告恶心