https://github.com/jream/typescript-debug-vscode
Nothing but a plain config for TypeScript in VSCode
https://github.com/jream/typescript-debug-vscode
typescript vscode
Last synced: 10 months ago
JSON representation
Nothing but a plain config for TypeScript in VSCode
- Host: GitHub
- URL: https://github.com/jream/typescript-debug-vscode
- Owner: JREAM
- Created: 2024-07-20T19:12:37.000Z (almost 2 years ago)
- Default Branch: main
- Last Pushed: 2024-07-20T19:44:00.000Z (almost 2 years ago)
- Last Synced: 2025-03-02T16:48:44.940Z (over 1 year ago)
- Topics: typescript, vscode
- Language: TypeScript
- Homepage:
- Size: 2.93 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# TypeScript Debug VSCode
This is just a simple project setup to show you howt to use VSCode with the built-in debugger in a starter Typescript project.
### Clone & Install
```bash
git clone https://github.com/JREAM/typescript-debug-vscode.git
cd typescript-debug-vscode
npm install
```
### Example
> Note: I have TypeScript and TypeScript-Node installed globally. This is accomplished with `npm install -g typescript ts-node`
>
## Project Commands
These are just reminders of using packages:
- **tsc**: TypeScript Compiler _(From the TypeScript package)_
- **ts-node**: TypeScript Node Runtime
- `npm run dev` - will watch & compile for file changes of `src/index.ts`
- `npm run build` - will compile files into `./js` in the `./dist` folder.
If you have the very handy [nodemon](https://nodemon.io/) package installed globally (recommended) `npm install -g nodemon` you can type:
- `nodemon`: This will read the `nodemon.json` file and watch for all file changes under `src/`. This way you can save any file and it will reload the changes.
## Configuration
- The `.vscode` folder is included in git (might be hidden), follow instructions if you are stuck.
- The `tsconfig.json` sets the `outDir: ./dist` so `.js` files don't pollute the `.ts` files when you run `npm run build` or `tsc`.
- Required `devDependencies`, used in `.vscode/launch.json`
- `ts-node`
- `tsconfig-paths`
## Manual Configuration
- Create a new `.vscode/launch.json` file by:
- Ctrl+Shift+D and select _Create new Launch File._
- This creates a `.vscode` folder.
Add the following line in the `configurationto the file:
```json
"runtimeArgs": [ "-r", "ts-node/register", "-r", "tsconfig-paths/register" ],
"console": "integratedTerminal",
```
If you want to run the output in the `Integrated Terminal` Ctrl+~ rather than the `Debug Console` Ctrl+Shift+Y change this:
```json
// Console is not needed unless you change it, default is internalConsole.
"console": "internalConsole",
// This will use the Terminal instead.
"console": "integratedTerminal",
```
## Run in VSCode
- Open the `src/index.ts` and add some **breakpoints** in the gutter.
- Press `F5` or `Run > Start Debugging`.
- Also open your `Integrated Terminal` with Ctrl+~ or the `Debug Console` Ctrl+Shift+Y for program output.
---
© 2024 MIT | [JREAM](https://jream.com) | Jesse Boyer