VS Code Angular 4 Debug:Angular CLI

launch.json

{
    "noteComment": "I copied this from https://stackoverflow.com/questions/42495655/how-to-debug-angular-with-vscode",
    "version": "0.2.0",
    "configurations": [
      {
        "type": "chrome",
        "request": "launch",
        "name": "Launch Chrome",
        "url": "http://localhost:4200",
        "webRoot": "${workspaceRoot}",
        "sourceMaps": true,
        "userDataDir": "${workspaceRoot}/.vscode/chrome",
        "runtimeArgs": [
          "--disable-session-crashed-bubble"
        ]
      },
      {
        "name": "Attach Chrome",
        "type": "chrome",
        "request": "attach",
        "url": "http://localhost:4200",
        "port": 9222,
        "webRoot": "${workspaceRoot}",
        "sourceMaps": true
      }
    ]
  }

linux-chromium-launch.json

{
    "version": "0.2.0",
    "configurations": [
        {
            "name": "ng serve",
            "type": "chrome",
            "request": "launch",
            "runtimeExecutable": "/usr/bin/chromium-browser",
            "url": "http://localhost:4200/#",
            "webRoot": "${workspaceRoot}"
        },
        {
            "name": "ng test",
            "type": "chrome",
            "request": "launch",
            "runtimeExecutable": "/usr/bin/chromium-browser",
            "url": "http://localhost:9876/debug.html",
            "webRoot": "${workspaceRoot}"
        },
        {
            "name": "ng e2e",
            "type": "node",
            "request": "launch",
            "runtimeExecutable": "/usr/bin/chromium-browser",
            "program": "${workspaceRoot}/node_modules/protractor/bin/protractor",
            "protocol": "inspector",
            "args": [
                "${workspaceRoot}/protractor.conf.js"
            ]
        }
    ]
}