Debugging

[yanshuf0]

Any idea how to debug such an application? I am using VSCode. Can the same process debug the server and client code?

[bojidaryovchev]

Basically what I do when I want to see whats happening is I put a console.log wherever I need it.. If you want to debug the angular app, you need to have the angular dev server running, preferably concurrently with the backend server - for that purpose, run "npm run watch" - then, you put a console.log in the angular component or in some controller/resolver handler.. Heres an example:

https://ibb.co/bx7LHd
https://ibb.co/fBzpAy
https://ibb.co/d1M2Vy

[jesusvalenzuelar]

Hi,

Consider adding a launch setting for vscode, for example:

launch.json:

{
    "version": "0.2.0",
    "configurations": [
        {
            "type": "node",
            "request": "launch",
            "name": "Iniciar programa",
            "program": "${workspaceFolder}\\index.js",
            "outFiles": [
                "${workspaceFolder}/dist/**/*.js"
            ]
        }
    ]
}

and in your index.js just run your app:

require('ts-node/register');
require('./src/server');

At the end just press F5 Key in visual studio code and add some breakpoint to start debugging.

[windivi]

you can try this:
"node --inspect -r ts-node/register src/server/main.ts";
.vscode:
{
"version": "0.2.0",
"configurations": [
{
"type": "node",
"request": "attach",
"name": "Attach",
"restart": true,
"port": 9229
}
}

[weeco]

You can also run ts-node directly with VSCode and therefore no transpilation is needed at all:

      {
          "type": "node",
          "request": "launch",
          "name": "Request Worker",
          "runtimeArgs": [
              "--nolazy",
              "-r",
              "${workspaceRoot}\\node_modules\\ts-node\\register"
          ],
          "args": [
              "${workspaceRoot}\\src\\request-worker\\main.ts"
          ]
      }

As of debugging Angular apps I'd use the chrome debugger, as described here: https://code.visualstudio.com/docs/nodejs/angular-tutorial . This way you can debug your angular frontend code in VSCode