Debugging JavaScript with Visual Studio Code and Chromium

VS Code - Debugger for Chrome allows you to debug JavaScript code in the Google Chrome browser, or other targets that support the Chrome Debugging Protocol.

I’m using it with Chromium and it works flawlessly. It goes without saying that it’s more comfortable to set breakpoints directly in an editor rather than in Chrome Developer Tools.

Here’s my setup (launch.json) file, note the runtimeArgs, where I’ve set costume user data directory. This allows me to keep personal instances of Chromium opened, separated from work and development, plus no need to restart Chromium with remote-debugging-port parameter.

{
  "version": "0.2.0",
  "configurations": [
    {
      "name": "Launch Chromium against localhost",
      "type": "chrome",
      "request": "launch",
      "url": "http://localgost:9000/",
      "sourceMaps": false,
      "webRoot": "${workspaceRoot}/app",
      "runtimeExecutable": "/usr/bin/chromium",
      "runtimeArgs": [
        "--remote-debugging-port=9222",
        "--user-data-dir=~/Projects/Secret/.chromium-cache/"
      ]
    },
    {
      "name": "Attach to Chromium",
      "type": "chrome",
      "request": "attach",
      "port": 9222,
      "sourceMaps": false,
      "webRoot": "${workspaceRoot}/app"
    }
  ]
}