既存の Node.js アプリケーションを徐々に TypeScript 化していく場合の導入方法のメモです。
Migrating from JavaScript | TypeScript オフィシャルサイトのこちらのぺージが参考になりますが、クライアントサイドを例書かれているので、サーバーサイドは勝手が違います。
typescript と ts-node のインストール
まず typescript と ts-node しましょう。 ts-node はコンパイルせずに直接 ts ファイルを実行できます。
1 | $ npm install -g typescript ts-node |
または -g
ではなく --save-dev
としてローカルにインストールします。
tsconfig.json の生成
1 | $ tsc --init |
tsconfig.json 生成されるので、 "target": "es2018"
, allowJs: true
, "outDir": "./dist"
にそれぞれ変更します。理由は Promise などを使えるようにするため、JavaScriptファイルはそのまま使うため、コンパイルしたものを dist ディレクトリに出力するためです。
tsconfig.json
1 | { |
main ファイルを .ts にする
例えばメインファイルの app.js を app.ts にリネームして、 tsc
で実行します。
1 | $ tsc app.ts |
上記のように require が失敗するので、 メッセージ通り @types/node
を追加します。
1 | $ npm install --save-dev @types/node |
ts ファイルを js ファイルにコンパイルする
下記の通り、再度コンパイルすると app.js
が生成されます。
1 | $ tsc app.ts |
ts ファイルを直接実行する
1 | $ ts-node app.ts |
そのまま実行できます。これで最低限の導入が完了です。
アプリケーションのコンパイル
1 | $ tsc |
これで tsconfig.json に従って、 ./dist
ディレクトリ以下に ts ファイル (及び js ファイル)はコンパイルされます。
ソースディレクトリを分けるかどうか
最初に載せたページでは、 ts-loader/webpack による逐次コンパイルが前提のため src ディレクトリが出てきますが、 ts-node の登場によってコンパイルを意識せずに実行できるようになるため、 ./src
に既存の JS ファイルを全て移動する必要はないと考えます。
但し Web アプリケーション等のようにアセットファイルや設定ファイルを置くディレクトリなどがある場合は、 ソースディレクトリを切った方が対象ファイルの指定が楽になると思います。