Debug reactjs project by executing 'make run' in visual studio code

Question

I have project structure as shown below. Through command line we use make run to start the execution but need to debug by using breakpoints in it. So how to setup in vsc.

Below is my launch.json file

{
    "version": "0.2.0",
    "configurations": [
    {
        "type": "node",
        "request": "attach",
        "name": "Attach",
        "port": 9229
    },
        {
            "type": "node",
            "request": "launch",
            "name": "Launch Program",
            "program": "${workspaceRoot}/make",
            "args": [
                "run"
            ]
        }
    ]
}

This doesn't work but how to setup.

Abhay Shiro · Accepted Answer · 2018-01-31 10:04:17Z

1

Go here first:

In the drop down above select Add configuration and select Node. THen add this in the launch.json file which opens up for you:

{
    // Use IntelliSense to learn about possible Node.js debug 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": "node",
            "request": "launch",
            "name": "Project Name Here",
            "program": "${workspaceRoot}/src\\server\\changeToYourAppFile.js",
            "cwd": "${workspaceRoot}",
            "restart": true,
            "protocol": "inspector"
        }
    ]
}

The following is my app file:

server = app.listen(port, err => {
    if (err) { return console.error(err); }
    console.info('==> ✅ 💻 Express server is listening');
    console.info(`==> 🌎 😃 Go to http://localhost:${port} [${env}]`);
});

server.timeout = 3600000;

edited Jan 31, 2018 at 10:04

answered Jan 31, 2018 at 9:57

Abhay Shiro

3,6672 gold badges19 silver badges27 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Abhay Shiro Over a year ago

make sure that the port number specified in your project is not already in use. If you are using webpack-dev-server make sure you stop that. If you are using PM2 then kill the pm2 instance and do this.

Sharath Over a year ago

I don't have a js file to be invoked like you have mentioned in configurations.program. I have a make file so I need to run make run

Abhay Shiro Over a year ago

Yeah. you do that and then put the server start code o'er there. Give this file's path in the launch.json then

Sharath Over a year ago

Its not as simple as you have mentioned the server start code. Its configured differently. So that's the reason I was asking how to execute make run command from VSC

Collectives™ on Stack Overflow

Debug reactjs project by executing 'make run' in visual studio code

1 Answer 1

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related