How can I run tsc –watch and nodemon together using npm scripts?

A common approach is to run both processes concurrently—one process watches and recompiles your TypeScript files, while the other watches the compiled JavaScript files and restarts your application when changes are detected.

A popular way to do this is by using the concurrently package:

{
  "scripts": {
    "build:watch": "tsc --watch",
    "serve": "nodemon dist/index.js",
    "dev": "concurrently \"npm run build:watch\" \"npm run serve\""
  }
}

In this setup:

• tsc --watch recompiles your TypeScript code whenever a source file changes.
• nodemon monitors the compiled output (typically the dist folder) and automatically restarts the application after a successful build.
• concurrently runs both commands in a single terminal, making development much more convenient.

If you’re starting a new TypeScript project, you can also consider tools like ts-node-dev, tsx, or nodemon with ts-node, which allow you to run TypeScript directly without a separate compilation step. These tools often provide a faster and simpler development experience while still supporting automatic reloads.

Yes, you can run tsc --watch and nodemon together using npm scripts. This is a common setup for TypeScript projects because it allows the TypeScript compiler to automatically rebuild your code while nodemon restarts the Node.js application whenever the compiled JavaScript changes.

The easiest way to achieve this is by using a utility such as concurrently or npm-run-all, which lets multiple scripts run in parallel from a single command.

A typical workflow looks like this:

• tsc --watch continuously compiles TypeScript files into JavaScript.
• nodemon watches the compiled output directory (usually dist) and restarts the server whenever a new build is generated.
• Running both together gives you a smooth development experience without manually rebuilding or restarting the application.

A few best practices:

• Configure nodemon to watch the compiled JavaScript output rather than the TypeScript source files.
• Keep your compiled files in a separate directory (such as dist) to avoid unnecessary restarts.
• Enable source maps in your TypeScript configuration if you need easier debugging.
• Exclude folders like node_modules and build artifacts that don’t need to trigger restarts.

If you’re using a newer development setup, you might also consider tools like tsx, ts-node-dev, or nodemon with ts-node, which can execute TypeScript directly and often eliminate the need for a separate compilation step during development.

For most projects, however, running tsc --watch alongside nodemon remains a reliable and widely used workflow because it closely mirrors how the application is built and run in production.