angular - Debugging Angular2 apps in Visual Studio Code -


i'm trying develop basic angular2 app using vsc. code written in typescript. basic todo app, , code (.ts, js, .js.map) in app/ subfolder.

this launch.json configuration run:

 {             "name": "run",             "type": "node",             "request": "launch",             "program": "${workspaceroot}/node_modules/lite-server/bin/lite-server",             "stoponentry": false,             "args": [],             "cwd": "${workspaceroot}",             "prelaunchtask": null,             "runtimeexecutable": null,             "runtimeargs": [                 "--nolazy"             ],             "env": {                 "node_env": "development"             },             "externalconsole": false,             "sourcemaps": false,             "outdir": null         }, 

when run it, app loads in chrome none of breakpoints work. when hover breakpoint, see "breakpoint ignored because generated code not found (source map problem?)."

i've got 1 breakpoint in /app/todo.component.ts. in /app/todo.component.js.map can see:

"file":"todo.component.js","sourceroot":"/users/xxx/documents/webs/angular2-todo/app/","sources":["todo.component.ts"],"names":[],"mappings":";;;;;;;;;; 

source root , sources seem ok me.

any ideas?

you have do:

  1. install "debugger chrome"-extension
  2. delete launch.json , create new 1 (select "chrome" instead of "node.js").
  3. change port 3000 (if use lite-server, in tour-of-heroes-tutorial) , add "userdatadir":

example:

{     "name": "launch chrome against localhost, sourcemaps",     "type": "chrome",     "request": "launch",     "url": "http://localhost:3000",     "sourcemaps": true,     "webroot": "${workspaceroot}",     "userdatadir": "${workspaceroot}/out/chrome" } 
  1. start server "npm start" (terminal-window or console).

  2. launch debugging (f5 or select "launch chrome against localhost..." in dropdown).


Comments

Popular posts from this blog

wordpress - (T_ENDFOREACH) php error -

Export Excel workseet into txt file using vba - (text and numbers with formulas) -

Using django-mptt to get only the categories that have items -