Skip to content

Instantly share code, notes, and snippets.

@khalidx
Last active December 2, 2023 04:47
Show Gist options
  • Save khalidx/96b32737860314140f704165d8da38d8 to your computer and use it in GitHub Desktop.
Save khalidx/96b32737860314140f704165d8da38d8 to your computer and use it in GitHub Desktop.
A VSCode launch config for debugging a TypeScript project.

This is a simple VSCode launch configuration for debugging TypeScript code that will work with most TypeScript projects.

It allows you to easily debug your project using the awesome debugging experience in VSCode.

It works perfectly for library and CLI projects that are written in TypeScript and are targeting CommonJS.

Usage

  1. Create a .vscode/ folder in your workspace at the top-level, if you don't have that folder already.

  2. Add the configuration below to .vscode/launch.json.

  3. Before using the configuration below, make sure you update the cwd field to point to the exact folder that holds your TypeScript project, if you are using a workspace that has multiple subfolders.

    For example, if your tsconfig.json file is in ${workspaceFolder}/my-typescript-project/, make sure to set that as the value of cwd, like: "cwd": "${workspaceFolder}/my-typescript-project/".

  4. Set any arguments that your library or CLI expects in the args field, or leave it empty.

  5. The default mode for debugging is transpile-only, which ignores TypeScript errors and lets the project start up right away. If you don't want to ignore errors, change ts-node/register/transpile-only to ts-node/register.

  6. Click the "Run and Debug" button in the sidebar, then click the green play button (making sure the launch configuration below is selected in the dropdown). That's it!

Configuration

{
  "version": "0.2.0",
  "configurations": [
    {
      "name": "Launch Program",
      "type": "node",
      "request": "launch",
      "cwd": "${workspaceFolder}/",
      "runtimeArgs": [
        "-r",
        "ts-node/register/transpile-only"
      ],
      "args": []
    }
  ]
}

Extras

I've also included a sample tsconfig.json file that you can use to get started.

This has been tested with the configuration above, running on node v18.

{
  "compilerOptions": {
    "rootDir": "src/",
    "outDir": "dist/",
    "moduleResolution": "node",
    "module": "CommonJS",
    "esModuleInterop": true,
    "lib": [ "ES2021" ],
    "target": "ES5",
    "strict": true
  }
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment