How to Watch and Reload ts-node When TypeScript Files Change

By the end of this page, you will understand how ts-node fits into a TypeScript development workflow, why it does not automatically restart your app on file changes by itself, and how to pair it with file-watching tools like nodemon. You will also see practical command examples, common mistakes, and a small mini-project for creating a TypeScript dev server with automatic reloads.

ts-node lets you run TypeScript files directly in Node.js without manually compiling them first with tsc.

That solves execution, but not watching.

These are two separate concerns:

• Running TypeScript directly: handled by ts-node
• Watching files and restarting when they change: handled by a watcher such as nodemon, node --watch in some setups, or similar tools

This distinction matters because many beginners expect ts-node to behave like a full development server. In reality, ts-node is mainly an execution tool. If your server is running and you edit a .ts file, Node does not automatically restart unless another tool is monitoring those files.

In real programming, this pattern is very common:

• one tool runs the code
• another tool watches for changes
• sometimes a framework combines both for convenience

For a TypeScript backend or local development server, a common setup is:

• ts-node to execute .ts files
• nodemon to watch files and restart the process

This gives you a fast feedback loop during development without needing to run a full manual compile step each time.

Think of your development setup like a kitchen:

• ts-node is the cook who knows how to prepare TypeScript and serve it immediately.
• A watcher like nodemon is the bell that notices when ingredients have changed and tells the cook to start over.

If you only have the cook, nothing happens when new ingredients arrive. If you only have the bell, it can ring, but no one knows how to run TypeScript.

You usually need both working together.

The most common beginner-friendly setup is to use nodemon with ts-node.

Install the tools

npm install --save-dev ts-node typescript nodemon

Basic command

npx nodemon --watch src --ext ts --exec ts-node src/index.ts

What this does

• --watch src watches the src folder
• --ext ts restarts only when .ts files change
• --exec ts-node src/index.ts runs your app with ts-node

Example project file

import http from 'http';

const server = http.createServer((req, res) => {
  res.writeHead(200, { 'Content-Type': 'text/plain' });
  res.end('Hello from TypeScript');
});

server.listen(3000, () => {
  console.log('Server running on http://localhost:3000');
});

If you save changes to this file, nodemon detects the update and restarts the server.

Using package.json

This is how developers usually make the command easier to run:

{
  "scripts": {
    "dev": "nodemon --watch src --ext ts --exec ts-node src/index.ts"
  }
}

Then run:

npm run dev

Alternative with a nodemon config file

{
  "watch": ["src"],
  "ext": "ts,json",
  "exec": "ts-node src/index.ts"
}

Save that as nodemon.json, then run:

npx nodemon

This approach keeps package.json cleaner.

Consider this file:

let count = 0;

console.log('Starting app...');
console.log('Count is', count);

And this command:

npx nodemon --watch src --ext ts --exec ts-node src/index.ts

What happens step by step

1. nodemon starts running.
2. It begins watching the src directory.
3. nodemon executes:

   ts-node src/index.ts
   

4. ts-node reads src/index.ts.
5. It compiles the TypeScript in memory.
6. It runs the resulting JavaScript in Node.js.
7. The console shows:

   Starting app...
   Count is 0
   

8. You edit src/index.ts and save the file.
9. nodemon notices that a .ts file changed.
10. nodemon stops the current process.
11. nodemon runs ts-node src/index.ts again.
12. Your updated code starts running.

That is the core development loop: watch → detect change → restart → run updated TypeScript.

Automatic watching and restarting is useful in many real projects:

API development

When building an Express or Fastify API in TypeScript, you want the server to restart immediately after route or controller changes.

Background workers

If you have TypeScript scripts that process queues, cron jobs, or scheduled tasks, watching helps during development and debugging.

CLI tools

When building a command-line tool in TypeScript, auto-reload speeds up testing changes.

Full-stack local development

A frontend app may already have hot reload, but your TypeScript backend still needs a separate watch-and-restart workflow.

Prototyping

During early development, skipping manual tsc builds makes iteration faster and simpler.

In real codebases, developers usually do not run long raw commands manually. They wrap them in scripts and configuration files.

Common pattern: package.json scripts

{
  "scripts": {
    "dev": "nodemon",
    "build": "tsc",
    "start": "node dist/index.js"
  }
}

Then nodemon.json contains the development behavior.

Common pattern: separate dev and production flows

Development:

• run with ts-node
• watch with nodemon
• restart automatically

Production:

• compile with tsc
• run generated JavaScript from dist

This separation matters because ts-node is usually best for development convenience, while compiled output is more common in production.

Common pattern: validation before startup

Some teams add type checking or linting alongside watching:

• tsc --noEmit for type checking
• ESLint for style and quality
• nodemon for restart behavior

Common pattern: environment-based startup

Developers often combine watching with environment variables:

{
  "scripts": {
    "dev": "NODE_ENV=development nodemon --exec ts-node src/index.ts"
  }
}

In cross-platform projects, they may use cross-env so this works on Windows too.

1. Expecting ts-node alone to watch files

Broken expectation:

ts-node src/index.ts

This runs the file once. It does not restart when files change.

Fix

Use a watcher:

npx nodemon --watch src --ext ts --exec ts-node src/index.ts

2. Watching the wrong folder

Broken example:

npx nodemon --watch app --ext ts --exec ts-node src/index.ts

If your files are actually in src, changes may not trigger restarts.

Fix

Match your real source directory.

3. Forgetting file extensions

Broken example:

npx nodemon --watch src --exec ts-node src/index.ts

This may still work in some cases, but being explicit is safer.

Fix

Specify TypeScript files:

npx nodemon --watch src --ext ts --exec ts-node src/index.ts

4. Using development commands in production

Running ts-node directly in production is often not the usual deployment approach.

Better approach

• develop with ts-node
• build with tsc
• deploy compiled JavaScript

5. Confusing Angular frontend reload with Node server reload

Angular tooling already handles frontend rebuild and reload differently from a Node backend.

If you are running both:

• Angular dev server manages frontend changes
• nodemon + ts-node manages backend changes

These are separate processes.

6. Restart loops caused by generated files

If your watcher also watches compiled output like dist, you can trigger repeated restarts.

Fix

Ignore build folders:

{
  "watch": ["src"],
  "ignore": ["dist"],
  "ext": "ts",
  "exec": "ts-node src/index.ts"
}

ts-node + nodemon vs tsc --watch

When to choose each

• Choose ts-node + nodemon when you want quick backend development.
• Choose tsc --watch when you want to inspect build output or mimic production more closely.
• Use Angular CLI for frontend watching, not for a Node backend process.

# Install dev tools
npm install --save-dev typescript ts-node nodemon

# Run TypeScript with auto-restart
npx nodemon --watch src --ext ts --exec ts-node src/index.ts

package.json script

{
  "scripts": {
    "dev": "nodemon --watch src --ext ts --exec ts-node src/index.ts"
  }
}

nodemon.json

{
  "watch": ["src"],
  "ext": "ts,json",
  "ignore": ["dist", "node_modules"],
  "exec": "ts-node src/index.ts"
}

Key idea

• ts-node runs TypeScript
• nodemon watches files and restarts the process

Good development flow

• npm run dev for local development
• tsc for production build
• node dist/index.js for production execution

Common flags

• --watch src watch a folder
• --ext ts restart on .ts changes
• --exec ... command to run

Watch out for

• wrong source folder
• watching dist by mistake
• expecting ts-node alone to reload

Does ts-node automatically reload when files change?

No. ts-node runs TypeScript files directly, but it does not watch files and restart by itself.

What tool should I use with ts-node for auto-reload?

A common choice is nodemon. It watches file changes and reruns ts-node when needed.

Can I use this with an Angular project?

Yes, but usually for the backend or custom Node scripts. Angular frontend reloading is normally handled by Angular's own dev server.

Is ts-node meant for production?

It can be used in some setups, but many projects compile TypeScript with tsc and run the generated JavaScript in production.

Why does my app keep restarting in a loop?

You may be watching generated files like dist or other files that change during startup. Ignore those folders in your watcher config.

Should I use tsc --watch instead of nodemon?

Use tsc --watch if you want automatic compilation. Use nodemon with ts-node if you want direct execution and restart during development.

Can I watch more than one file type?

Yes. For example, nodemon can watch both ts and json files by setting ext to ts,json.

• TypeScript compilation — Helps explain the difference between running TypeScript directly and compiling it first.
• Node.js development workflow — Shows how local server startup, restart, and scripts are usually organized.
• npm scripts — Useful for turning long dev commands into simple reusable commands.
• nodemon — The most common file watcher used with Node.js development servers.
• tsc --watch — A related approach that rebuilds TypeScript automatically instead of running it directly.
• Angular CLI dev server — Important when separating frontend live reload from backend restart behavior.
• Development vs production builds — Explains why teams often use ts-node in development and compiled JavaScript in production.