どちらも
typescriptでの開発には持って来いなパッケージ達ですが、初めて調べた時、似たような名前でどっちを使えばいいのか結構悩んだので、違いをまとめておきます。
ts-node
ts-nodeパッケージを追加します。
npm install typescript ts-node
typescriptも追加しないと、tsファイルが動かないので、これも追加します。
※グローバルにインストール済みの場合は必要ないです。
tsファイルを作成
console.log("Hello World");
package.jsonに下記を追加
"scripts": {
"ts-node": "ts-node src/index.ts"
},
実行してみます。
npm run ts-node
> ts-node_t@1.0.0 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ファイルを作成
console.log("Hello World");
package.jsonに下記を追加
※オプションについては後述
"scripts": {
"ts-node-dev": "ts-node-dev --respawn src/index.ts"
},
実行してみます。
npm run ts-node-dev
> ts-node-dev_t@1.0.0 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ファイルの出力文言を変えて保存してみます。
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って省略もできるので、こちらも試してみてください。
通知抑制
それから意外と重要なのがこれ
{
"notify": false
}
こいつがないと変更を検知するたびに、こんな感じででかい音と共に通知が飛んできます。
まとめ
ts-node
tsファイルをjsファイルにコンパイルすることなく、起動することができる
ts-node-dev
tsファイルをjsファイルにコンパイルすることなく、起動することができ、
さらに監視モードで素早く再起動が使用できる
ちなみに、現状nodemonのほうが結構有名かなと思ってるんですけど、nodemonよりts-node-devのほうが大幅に再起動の速度が早いらしい！
（試したわけじゃないですけど、公式に明記してあります。）