How do I execute typescript watch and running server at the same time?

Step 1

install concurrently, use npm or yarn

yarn add concurrently -D   

Step 2

create a script with this command

"scripts": {
    "run": "tsc && concurrently \"tsc -w\" \"nodemon dist/app.js\"",
}

run tsc first so that your directory has something at the time of running node

And with that you will have running your Typescript application 🚀


TLDR, If you like nodemon this is a straight forward way to get file watch, compilation and execution:

nodemon --ext ts --exec 'tsc && node dist/index.js'

Optionally replace tsc with babel for faster compilation.

Here is a more complete example, in package.json (with source maps):

"scripts": {
  "develop": "nodemon --ext ts --exec 'yarn build --incremental && yarn serve'",
  "build": "tsc",
  "serve": "node --require source-map-support/register dist/index.js",
  ...
},

Install source-map-support as a dependency if you want, ahem... source map support! Otherwise, remove --require source-map-support/register from the serve script above.

tsconfig.json

{
  "compilerOptions": {
    ...
    "sourceMap": true,
    "outDir": "dist",
  }
}

My idea is merge the commands as tsc -w & node app.js but I can't work the two commands at the same time. How do I do

You have a few options. Simplest is to use ts-node-dev : https://github.com/whitecolor/ts-node-dev


Another option can be to use nodemon:

tsc -w & nodemon app.js

Since Typescript 3.4 the compilation is faster because you can use the incremental compiler option and they keep improving (including interesting changes for large projects in 3.8).

Update:

I also moved to use concurrently as HerberthObregon says in his answer