Visual Studio Codeを使用したTypeScriptプロジェクトの作成

Visual Studio Code（VS Code）で TypeScript プロジェクトを作成する手順をメモします。

Contents

ソフトウェアのインストール

Node.js
Node.js は TypeScript をコンパイルするために必要です。Node.js 公式サイトからインストーラをダウンロードしてインストールしてください。
VS Code
もしまだインストールしていない場合は、VSCode 公式サイトからインストーラをダウンロードしてインストールしてください。

ターミナル（またはコマンドプロンプト）を開き、以下のコマンドを実行して TypeScript をグローバルにインストールします。

npm install -g typescript

次のコマンドを入力して実行すると、TypeScript コンパイラのバージョンが表示され、TypeScript がインストールされているかどうかがわかります。

tsc --version

新しいディレクトリを作成して、そのディレクトリで VS Code を開きます。

mkdir my-ts-project
cd my-ts-project
code .

ターミナルを開いて（VSCode 内で表示 > ターミナル）、以下のコマンドを実行し、新しい Node.js プロジェクトを初期化します。

npm init -y

tsconfig.json ファイルを生成します。これは TypeScript プロジェクトの設定ファイルです。

tsc --init

プロジェクトのルートに tsconfig.json ファイルが作成されます。ここでコンパイラのオプションを調整できます。

プロジェクトのルートディレクトリに src フォルダを作成し、その中に index.ts という名前の TypeScript ファイルを作成します。

サンプルコードを以下に記載します。基本的な関数を定義し、コンソールにメッセージを出力します。

// TypeScriptの基本的な関数を定義
function greet(name: string): string {
    return `Hello, ${name}!`;
}

// 関数を使用してコンソールに出力
console.log(greet('World'));

ビルドスクリプトを設定します。package.json ファイルを開いて、scripts セクションに以下のように追記します。

"scripts": {
  "build": "tsc",
  "start": "node ./dist/index.js"
}

プロジェクトをビルドします。

npm run build

アプリケーションを実行します。

npm run start