VS Code Unverified Breakpoints

Question

I\'m trying to debug a Node/Express TypeScript app in VS Code (v. 1.24.0) and all my breakpoints are greyed out during debugging.

The error is \"Unverified Breakpoint, B

Answer 1

I was running into an identical issue; if an error was present, the debugger would report on the error, but if no error it would not stop on breakpoints. The change that resolved for me was to specify the exact filename that would be served rather than just localhost. For example on NodeJS, Express just specifying localhost:3000 would not stop on my breakpoints, but specifying localhost:3000/index.html worked as expected

Full config which stops on breakpoints as expected (to date):

My folder open in VSCode: learningPixi with full folder location (Ubuntu Linux): /home/leigh/node/pixi-tut/learningPixi

My folder structure is:

/home/leigh/node/pixi-tut/learningPixi/.vscode/launch.json /home/leigh/node/pixi-tut/learningPixi/public/index.html /home/leigh/node/pixi-tut/learningPixi/server.js

Contents of my launch.json file:

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "chrome",
      "request": "launch",
      "name": "Launch Chrome against localhost",
      "url": "http://localhost:3000/index.html",
      "webRoot": "${workspaceFolder}/public",
      "skipFiles": ["pixi.min.js"]
    }
  ]
}

"skipFiles" was also very useful otherwise debugger steps into every function call

My (very basic) express server config just for debugging JavaScript in static files was:

const express = require('express');
const path = require('path');

const app = express();
app.use(express.static(path.join(__dirname, '/public')));
app.listen(3000, () => console.log('App started on port 3000'));

And as per folder structure above ensure index.html is located in /public folder

If debugging JavaScript from within an HTML file, you may also need to go to settings within VSCode and enable: Allow Breakpoints Everywhere

Answer 2

I got this issue today, I tried re-building, and re-running debugger. I shut down all VS Code instances and restarted, working now.

Answer 3

For anyone who runs into this error, I was able to find a solution. The issue was the way I was launching the Node process, not the mapping of the source maps (which produces a different error).

To attach to the process, I launched it from the VS Code terminal like this:

node --inspect dist/server.js

launch.json:

{
            "type": "node",
            "request": "attach",
            "name": "Attach by Process ID",
            "processId": "${command:PickProcess}",
            "protocol": "inspector",
            "address": "localhost",
            "port": 8080,
            "restart": true,
            "preLaunchTask": "npm: build",
            "sourceMaps": true,
            "outFiles" : [ "${workspaceRoot}/dist/**/*.js" ]
        },

Answer 4

I encountered this problem using vscode 1.25

Looks like it's triggered when a breakpoint-containing source (.ts) is changed while Debug session is running. The breakpoints could be re-enabled by re-saving the source, or by re-togglig the breakpoint.

However if the source was changed, then debugging has to be restarted to be in-sync with the source.

This issue seems to spill into the Edit mode too, the breakpoints would remain "Unverified" even after leaving the Debug mode. Again, re-saving the source appears to re-enable the breakpoints in this case.

Answer 5

For future readers: I ran into this issue because I had ran a prod build of my app before trying to debug. The prod build removes the sourcemaps that VS Code needs to debug successfully, so I ran a dev build of my app and then debug, and everything worked as expected.

Answer 6

I was finding all the breakpoints I tried to set in one file got this problem, but non of the rest.

I was naming the file dispatcher.js with a lower case, but pulling it into node with:

const { Dispatcher } = require('./Dispatcher')

and the contents was a javascript class being exported as:

module.exports = { Dispatcher }