둘 다

typescript로의 개발에는 가져온 패키지들입니다만, 처음 조사했을 때, 비슷한 이름으로 어느 쪽을 사용하면 좋은지 상당히 고민했기 때문에, 차이를 정리해 둡니다.

ts-node

ts-node 패키지를 추가합니다.

npm install typescript ts-node

typescript도 추가하지 않으면 ts 파일이 움직이지 않으므로 추가합니다.
※글로벌에 인스톨 완료의 경우는 필요 없습니다.

ts 파일 만들기

src/index.ts

console.log("Hello World");

package.json에 다음을 추가

pacage.json

  "scripts": {
    "ts-node": "ts-node src/index.ts"
  },

실행해 보겠습니다.

실행 결과

npm run ts-node       

> [email protected] ts-node C:\Users\ne240\Desktop\work\module_learning\ts-node_t
> ts-node src/index.ts

Hello World

컴파일없이 결과가 출력되었습니다.

옵션

일부 옵션을 소개해 둡니다.

-T, --transpile-only    // 型チェックを行わず、トランスパイル(ts->js)のみ行う
                        // 高速な起動が可能

-P, --project <path>    // tsconfig.ts のパスを指定できる
                        // 1つのプロジェクト内で複数の tsconfig.ts を使用したい時に便利

ts-node-dev

이어서 ts-node-dev
ts-node와 node-dev의 합체 버전이라고합니다.

ts-node와 마찬가지로 ts-node-dev를 추가합니다.

npm install typescript ts-node-dev

ts 파일 만들기

src/index.ts

console.log("Hello World");

package.json에 다음을 추가
※옵션에 대해서는 후술

pacage.json

  "scripts": {
    "ts-node-dev": "ts-node-dev --respawn src/index.ts"
  },

실행해 보겠습니다.

npm run ts-node-dev

> [email protected] ts-node-dev <PATH>
> ts-node-dev --respawn src/index.ts

Using ts-node version 8.10.1, typescript version 3.9.3
Hello World

적당히 ts 파일의 출력 문장을 바꾸어 저장해 봅니다.

src/index.ts

console.log("Goodbye World");

소스 코드의 변경을 감지하고 자동으로 변경 후 메시지를 출력했습니다.

[INFO] 13:13:44 Restarting: <PATH>\src\index.ts has been modified
Using ts-node version 8.10.1, typescript version 3.9.3
Goodbye World

옵션

이쪽도 옵션을 일부 소개해 둡니다.

--respawn               // 今回のサンプルのように本来実行して即終了のプログラムも、
                        // 終了せず監視状態になってくれる
                        // 常時起動の待ち受けサーバとかならいらない

--ignore-watch <path>   // 監視対象から除外するファイルを指定
                        // 公式には正規表現が使えるっぽいことが書いてあり試してみたが動作せず…
                        // できた方いれば教えてください。

옵션 지정 순서는

ts-node-dev [node-dev|ts-node flags] [ts-node-dev flags] [node cli flags] [--] [script] [script arguments]

그건 그렇고, ts-node-dev는 길지요.tsnd 라고 생략도 할 수 있으므로, 이쪽도 시도해 주세요.

알림 억제

그렇다면 의외로 중요한 것이

.node-dev.json

{
  "notify": false
}

이 녀석이 없으면 변경을 감지할 때마다 이런 느낌으로 큰 소리와 함께 알림이 날 수 있습니다.

요약

ts-node

ts 파일을 js 파일로 컴파일하지 않고 시작할 수 있습니다.

ts-node-dev

ts 파일을 js 파일로 컴파일하지 않고 시작할 수 있으며,
또한 모니터링 모드에서 재부팅을 신속하게 사용할 수 있습니다.

덧붙여서, 현상 nodemon 쪽이 상당히 유명할까라고 생각하고 있습니다만, nodemon보다 ts-node-dev 쪽이 대폭으로 재기동의 속도가 빠른 것 같다!
(시험한 것은 아니지만 공식적으로 명기하고 있습니다.)

참고

npm 공식 : ts-node
npm 공식 : ts-node-dev