Logo

How to watch and reload ts-node when TypeScript files change?

You can use a watcher tool such as nodemon or ts-node-dev to automatically re-run your TypeScript code on file changes. Below are two common approaches:

1. Using nodemon

  1. Install nodemon (either globally or locally):
    npm install --save-dev nodemon
  2. In your package.json (or a script), you might do something like:
    { "scripts": { "dev": "nodemon --watch 'src/**/*.ts' --exec 'ts-node src/index.ts'" } }
  3. Then run:
    npm run dev
  • nodemon listens for file changes in src/**/*.ts, and executes ts-node on your main file (src/index.ts) whenever it detects a change.

2. Using ts-node-dev

  1. Install ts-node-dev:
    npm install --save-dev ts-node-dev
  2. Add a script in package.json:
    { "scripts": { "dev": "ts-node-dev --respawn src/index.ts" } }
  3. Run:
    npm run dev
  • ts-node-dev automatically restarts the process when it sees changes in your TypeScript files, making it a popular choice for rapid development.

Tips

  • Use --watch or equivalent flags to specify which directories or files to watch.
  • nodemon is versatile because you can watch for changes in multiple folders, run different commands, etc.
  • ts-node-dev is often simpler for pure TypeScript projects—just point to your main file.

Bonus: If you want to strengthen your JavaScript fundamentals (which underlie TypeScript), check out the Grokking JavaScript Fundamentals course from DesignGurus.io. It covers essential JS topics (prototypes, closures, async patterns) that help you code more effectively in TypeScript.

CONTRIBUTOR
TechGrind