Cannot debug project in visual studio code

[mmakrzem]

I would like to debug the stencil component starter code in visual studio code. I tried the following configurations but neither of them work:

"configurations": [
 {
  "type": "chrome",
  "request": "attach",
  "name": "Attach to Chrome",
  "port": 3333,
  "webRoot": "${workspaceFolder}"
 },
 {
  "type": "chrome",
  "request": "launch",
  "name": "Launch Chrome against localhost",
  "url": "http://localhost:3333",
  "sourceMaps": true,
  "webRoot": "${workspaceFolder}"
 }
]

The launch version does successfully launch chrome and display the running stencil project, but all the breakpoints in visual studio code say they are 'unverified' thus execution doesn't stop at them. The attached version doesn't work, it gives me a 404 error message saying:

Cannot connect to runtime process, timeout after 10000 ms - (reason: Cannot connect to the target: 404 File Not Found
Url: /json
File: C:/work/projectA/www/json).

[jabreuar]

have you tried this?

{
      "type": "chrome",
      "request": "launch",
      "name": "Launch Chrome against localhost",
      "url": "http://localhost:3333",
      "sourceMaps": true,
      "sourceMapPathOverrides": {
        "*": "${webRoot}/*"
      }
    }