VSCode: Can't start node javascript project in debugger on mac OSX

Question

While trying to start the angular-phonecat tutorial project from VSCode debug the following error appears program '/Users/xxxx/src/node/angular-phonecat/8000' does not exist

The project was cloned as follows git clone --depth=14 https://github.com/angular/angular-phonecat.git

Here is the generated configuration

    {
    "version": "0.1.0",
    // List of configurations. Add new configurations or edit existing ones.
    "configurations": [
        {
            // Name of configuration; appears in the launch configuration drop down menu.
            "name": "Launch 8000",
            // Type of configuration.
            "type": "node",
            // Workspace relative or absolute path to the program.
            "program": "8000",
            // Automatically stop program after launch.
            "stopOnEntry": false,
            // Command line arguments passed to the program.
            "args": [],
            // Workspace relative or absolute path to the working directory of the program being debugged. Default is the current workspace.
            "cwd": ".",
            // Workspace relative or absolute path to the runtime executable to be used. Default is the runtime executable on the PATH.
            "runtimeExecutable": null,
            // Optional arguments passed to the runtime executable.
            "runtimeArgs": ["--nolazy"],
            // Environment variables passed to the program.
            "env": {
                "NODE_ENV": "development"
            },
            // Use JavaScript source maps (if they exist).
            "sourceMaps": false,
            // If JavaScript source maps are enabled, the generated code is expected in this directory.
            "outDir": null
        },
        {
            "name": "Attach",
            "type": "node",
            // TCP/IP address. Default is "localhost".
            "address": "localhost",
            // Port to attach to.
            "port": 5858,
            "sourceMaps": false
        }
    ]
}

The package.json is as follows

{
  "version": "0.0.0",
  "private": true,
  "name": "angular-phonecat",
  "description": "A tutorial application for AngularJS",
  "repository": "https://github.com/angular/angular-phonecat",
  "license": "MIT",
  "devDependencies": {
    "karma": "^0.12.16",
    "karma-chrome-launcher": "^0.1.4",
    "karma-firefox-launcher": "^0.1.3",
    "karma-jasmine": "~0.1.0",
    "protractor": "^2.1.0",
    "http-server": "^0.6.1",
    "tmp": "0.0.23",
    "bower": "^1.3.1",
    "shelljs": "^0.2.6"
  },
  "scripts": {
    "postinstall": "bower install",

    "prestart": "npm install",
    "start": "http-server -a 0.0.0.0 -p 8000",

    "pretest": "npm install",
    "test": "node node_modules/karma/bin/karma start test/karma.conf.js",
    "test-single-run": "node node_modules/karma/bin/karma start test/karma.conf.js  --single-run",

    "preupdate-webdriver": "npm install",
    "update-webdriver": "webdriver-manager update",

    "preprotractor": "npm run update-webdriver",
    "protractor": "protractor test/protractor-conf.js",

    "update-index-async": "node -e \"require('shelljs/global'); sed('-i', /\\/\\/@@NG_LOADER_START@@[\\s\\S]*\\/\\/@@NG_LOADER_END@@/, '//@@NG_LOADER_START@@\\n' + cat('bower_components/angular-loader/angular-loader.min.js') + '\\n//@@NG_LOADER_END@@', 'app/index-async.html');\""
  }
}

Answer 1

you need to run "npm start" from console, before using "Launch Localhost with sourcemaps" Debug options.

configurations will be something like { "name": "Launch localhost with sourcemaps", "types": "chrome", "request": "launch", "url": " http://localhost:8000/app ", "sourceMaps": true, "webRoot": "${workspaceRoot}" }

BTW, I am using version 0.2.0 launch.json.