Breakpoints are ignored in Visual Studio Code (yes, that one)

user_6537125 0
Viewed 417

I know this has been asked/stated a million times, but I just can't get this working and VSCode Github directed me here for questions (as I assume this is not a bug but rather my ineptitude).

I am running an Express app using the GOV.UK Prototype Kit. I want to debug my app using Visual Code (on Mac OS) and have followed numerous guides to do so, but all seem to have the same result...

  1. Start my app using npm start --inspect
  2. I have a launch.json:
{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "attach",
      "name": "Attach by Process ID",
      "processId": "${command:PickProcess}",
      "protocol": "inspector"
    }
  ]
}
  1. Attach the debugger from VS Code. All seems good based on the following output:
Debugger listening on ws://127.0.0.1:9229/a601df80-c84c-49e3-b1bc-9a128ad28c49
For help, see: https://nodejs.org/en/docs/inspector
Debugger attached.

Subsequently, I can use breakpoints in my start.js file, but not in any of my main app code such as ./app/views/x/something.js. If I set a breakpoint in something.js then the breakpoint turns to a grey circle (hovering tells me that the breakpoint is unverified) and is never triggered.

Apologies for asking this question when so many others have already but I just can't get it working. Thanks in advance.

visual-studio-code express node.js debugging
2 Answers

OK. In case it helps others in future with a similar situation, I'm posting the progress that I've made, which is a solution but not quite the perfect solution.

The crux of my problem (I think) was that start.js, amongst other things, initiates some gulp tasks, one of which is to use nodemon to launch listen-on-port.js and subsequently server.js. I had assumed that my VSC/debugger setup would be able to follow that chain of events, but apparently not (I'm not saying that it can't, just that in my case it wasn't doing).

So, recognising that the disconnect revolved around which process I was attaching to, lead me to the following and now working launch.json:

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Launch",
      "program": "${workspaceFolder}/start.js",
      "restart": true,
      "autoAttachChildProcesses": true
    },
    {
      "type": "node",
      "request": "attach",
      "name": "Debug",
      "restart": true,
      "processId": "${command:PickProcess}",
      "protocol": "inspector"
    }
  ],
  "compounds": [
    {
      "name": "Launch & debug",
      "configurations": ["Launch", "Debug"]
    }
  ]
}

Using the above, I now launch my app from VSC using the Launch configuration and then manually attach the debugger using the Debug configuration, attaching not to the original start.js but to a different process (listen-on-port.js in my setup).

In an ideal world, I'd combine the two into a compound (as shown above) but I can't find a way of auto-attaching to a process by name or port rather than by selecting a processId, and therefore haven't got that bit working yet.

user_65371250

This configuration in the launch file worked for me

{
    "version": "0.2.0",
    "configurations": [

        {
            "type": "node",
            "request": "launch",
            "name": "Launch Program",
            "skipFiles": [
                "<node_internals>/**"
            ],
            "program": "${workspaceFolder}/app.js"
        }
    ]
}
user_155550150
Related