Viteを使ったTypeScriptプロジェクトの作成方法


まず、Viteをインストールする必要があります。以下のコマンドを実行して、最新バージョンのViteをインストールします。

npm install -g create-vite

次に、Viteを使用してTypeScriptプロジェクトを作成します。以下のコマンドを実行してください。

npm create vite@latest my-project --template typescript

このコマンドは、最新バージョンのViteを使って"my-project"という名前のプロジェクトを作成します。プロジェクトのテンプレートとしてTypeScriptを選択しています。

プロジェクトが作成されたら、次のステップは依存関係のインストールです。作成したプロジェクトのディレクトリに移動し、以下のコマンドを実行して依存関係をインストールします。

cd my-project
npm install

依存関係のインストールが完了したら、Viteの開発サーバーを起動することができます。以下のコマンドを実行して、開発サーバーを起動します。

npm run dev

これで、ViteとTypeScriptを使ったプロジェクトのセットアップが完了しました。開発サーバーは http://localhost:3000 で実行されます。

ファイルを開き、以下のように設定します。

{
  "name": "my-project",
  "version": "1.0.0",
  "description": "Vite TypeScript Project",
  "keywords": [
    "Vite",
    "TypeScript",
    "プロジェクト作成",
    "コード例"
  ]
}