How to debug Typescript in VSCode

README.md

How to Debug TypeScript in VSCode

It was a pain for me to figure out how to debug TS in VSCode. Creating this doc for my reference and it might help you as well.

Have this in your tsconfig.json

 "sourceMap": true,  /* SUPER-DUPER Important Generates corresponding '.map' file. */
 "outFile": "./",    /* Concatenate and emit output to single file. */
 "outDir": "dist"    /* Redirect output structure to the directory. */,
 "rootDir": "."      /* Specify the root directory of input files. Use to control the output directory structure with --outDir. */,

launch.json

(Windows) Make sure you put the correct outFiles and sourceMaps to true

{
  // Use IntelliSense to learn about possible attributes.
  // Hover to view descriptions of existing attributes.
  // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Launch Program",
      "skipFiles": ["<node_internals>/**"],
      "protocol": "inspector",
      "preLaunchTask": "npm: build",
      "program": "${workspaceFolder}\\index.ts",
      "outFiles": ["${workspaceFolder}\\dist\\**\\*.js"],
      "sourceMaps": true,
      "trace": "all"
    }
  ]
}