Node.js 環境に TypeScriptとnodemonを導入し、ECMAScriptにも対応させる

はじめに

Node.js は JavaScript の実行環境として広く使われていますが、TypeScriptの直接実行をサポートしていません。本記事では、TypeScriptをNode.js環境で実行する方法に焦点を当て、さらにECMAScript モジュール (ESM) 、nodemonを利用するための設定についても解説します。

実行環境

"ts-node": "^10.9.1",
"@types/node": "^18.7.18",
"nodemon": "^2.0.20",

TypeScript と Node.js

Node.jsはTypeScriptを標準では直接実行できません。そのため、TypeScript コードはJavaScriptにコンパイルされる必要があります。ここで、開発者の助けとなるのが ts-node です。

ts-node の導入

ts-node は、TypeScript コードをリアルタイムで JavaScript に変換し、Node.js 環境で直接実行することを可能にします。これにより、TypeScript のコンパイルと実行を一括で行うことができます。

インストール方法

npm install ts-node
npm install @types/ts-node --save-dev

@types/ts-node型定義ファイルの重要性

@types/ts-node は ts-node のための型定義ファイルです。これにより、TypeScript の型安全性と自動補完機能が強化されます。

ECMAScript モジュールのサポート

Node.js は、ECMAScript モジュール (ESM) と CommonJS の両方をサポートしています。ESMは import 構文を使用し、CommonJSは require を使用します。ECMAScript モジュール方式が業界の主流であるため、僕はこの方式を採用します。

Node.js で ECMAScript モジュールを使用するには、package.json に "type": "module" を設定します。

package.json

"type": "module"

さらに、tsconfig.json で TypeScript のコンパイラオプションを調整します。

ここは僕がNext.jsで実行していることもあり特殊だと思います。
余計なオプションも複数紛れ込んでいると思いますが、Next.jsとExpressを利用している方はぜひ参考にしてみてください。一応僕は動きました。

tsconfig.json

{
  "compilerOptions": {
  },
  "ts-node": {
    "esm": true,
    "experimentalSpecifierResolution": "node"
  },
}

nodemon での自動リロード

開発中にファイルの変更を監視し、自動的に再起動するには nodemon が便利です。nodemon.json を以下のように設定することでts-nodeを入れた状態でnodemonを使用できるようになります

nodemon.json

{
  //./app.tsの部分はご自身の環境のサーバーのエントリーポイントを設定してください
  "watch": ["app.ts"],
  "ext": "ts",
  "exec": "ts-node ./app.ts"　

}

そうすると以下のnpm run serverで実行になります

package.json

"scripts": {
    "server": "nodemon ts-node/esm ./app.ts",
  },

まとめ

Node.js と TypeScript の組み合わせは、現代の Web 開発において非常に強力なツールです。ts-node と nodemon の使用により、開発プロセスが効率的かつ快適になります。このガイドが、TypeScript 開発をよりスムーズに進めるための一助となれば幸いです。