TypeScript のインストール方法 ステップバイステップガイド

TypeScript は、静的型を追加することで JavaScript をベースに構築される人気のプログラミング言語です。TypeScript のインストールは簡単なプロセスであり、このガイドでは、お使いのマシンに TypeScript を設定する手順を説明します。

前提条件

TypeScript をインストールする前に、Node.js と npm (Node Package Manager) がインストールされていることを確認してください。Node.js は JavaScript と TypeScript を実行するためのランタイム環境を提供し、npm はパッケージと依存関係を管理するために使用されます。

• npm を含む Node.js をダウンロードしてインストールします。
• ターミナルで次のコマンドを実行してインストールを確認します。

node -v
npm -v

これらのコマンドがバージョン番号を返す場合、TypeScript をインストールする準備は完了です。

TypeScriptのインストール

TypeScript は、システム全体にインストールすることも、特定のプロジェクト内にローカルにインストールすることもできます。ここでは両方の方法について説明します。

グローバルインストール

TypeScript をグローバルにインストールすると、システム上のどこからでも TypeScript コンパイラ (`tsc`) を使用できるようになります。

1. ターミナルまたはコマンドプロンプトを開きます。
2. TypeScript をグローバルにインストールするには、次のコマンドを実行します。

npm install -g typescript

このコマンドは、TypeScript パッケージをグローバルにダウンロードしてインストールします。TypeScript のバージョンを確認することでインストールを確認できます。

tsc -v

ローカルインストール

プロジェクト固有の設定では、TypeScript をローカルにインストールすることをお勧めします。これにより、異なるプロジェクトで異なるバージョンの TypeScript を使用できます。

1. ターミナルを使用してプロジェクト ディレクトリに移動します。

cd path/to/your/project

2. TypeScript をローカルにインストールするには、次のコマンドを実行します。

npm install typescript --save-dev

インストール後、プロジェクトのスクリプトに TypeScript を追加するか、`npx` コマンドを使用して TypeScript コンパイラを直接実行することで、TypeScript を使用できます。

npx tsc -v

TypeScript の設定

TypeScript では、コンパイラ オプションとプロジェクト設定を指定するための構成ファイル (`tsconfig.json`) が必要です。このファイルは手動で作成することも、TypeScript CLI を使用して生成することもできます。

1. デフォルトの `tsconfig.json` ファイルを生成するには、次のコマンドを実行します。

npx tsc --init

このコマンドは、プロジェクト ディレクトリにデフォルト設定の `tsconfig.json` ファイルを作成します。このファイルを変更して、プロジェクトのニーズに応じてコンパイラ オプションをカスタマイズできます。

インストールの確認

TypeScript が正しくインストールされていることを確認するには、単純な TypeScript ファイルを作成してコンパイルします。

1. 次の内容を含む「hello.ts」という名前の新しい TypeScript ファイルを作成します。

let message: string = "Hello, TypeScript!";
console.log(message);

2. TypeScript コンパイラを使用して TypeScript ファイルを JavaScript にコンパイルします。

npx tsc hello.ts

これにより、同じディレクトリに `hello.js` ファイルが生成されます。Node.js を使用してコンパイルされた JavaScript ファイルを実行します。

node hello.js

コンソールに「Hello, TypeScript!」と表示されます。

結論

TypeScript のインストールは、Node.js の設定、TypeScript のグローバルまたはローカルへのインストール、プロジェクトの構成という簡単なプロセスです。これらの手順に従うことで、TypeScript が稼働し、静的型付けと高度な機能を使用して開発エクスペリエンスを強化できるようになります。