How to debug a gulp task with VSCode

Question

I need to debug a command gulp start with VScode (I got some mapping error with babel during transpilation that I don't understand yet...). The VSCode debug default configuration aims to launch node app.js. How to modify it to trigger the gulp command?

Here is the default configuration. If anyone has hint of how can I do that, I'll be in your debt :)

{
    "version": "0.2.0",
    "configurations": [
        {
            "name": "Lancer",
            "type": "node",
            "request": "launch",
            "program": "${workspaceRoot}/app.js",
            "stopOnEntry": false,
            "args": [],
            "cwd": "${workspaceRoot}",
            "preLaunchTask": null,
            "runtimeExecutable": null,
            "runtimeArgs": [
                "--nolazy"
            ],
            "env": {
                "NODE_ENV": "development"
            },
            "externalConsole": false,
            "sourceMaps": false,
            "outDir": null
        },
        {
            "name": "Attacher",
            "type": "node",
            "request": "attach",
            "port": 5858,
            "address": "localhost",
            "restart": false,
            "sourceMaps": false,
            "outDir": null,
            "localRoot": "${workspaceRoot}",
            "remoteRoot": null
        }
    ]
}

Answer 1

In your "Lancer" configuration, make the following changes.

• Change program to "${workspaceRoot}/node_modules/gulp/bin/gulp.js"
• Change args to ["start"]

Set a breakpoint in the task you want to debug and launch the debugger. Change 'start' to the desired task name to debug other tasks.