NOTE

Vite は Bun で使用できますが、多くのプロジェクトは [HTML インポート](/ja/bundler/html-static) に切り替えることで、より高速なビルドを実現し、数百の依存関係を削減できます。

---

Vite は Bun ですぐに使用できます。Vite のテンプレートの 1 つで始めましょう。

bun create vite my-app

✔ Select a framework: › React
✔ Select a variant: › TypeScript + SWC
Scaffolding project in /path/to/my-app...

---

次にプロジェクトディレクトリに cd で移動し、依存関係をインストールします。

cd my-app
bun install

---

bunx を使用して vite CLI で開発サーバーを起動します。

--bun フラグは、Vite の CLI を node ではなく bun で実行するように指示します。デフォルトでは、Bun は Vite の #!/usr/bin/env node shebang 行 を尊重します。

bunx --bun vite

---

このコマンドを簡素化するには、package.json の "dev" スクリプトを以下のように更新します。

  "scripts": {
    "dev": "vite", 
    "dev": "bunx --bun vite", 
    "build": "vite build",
    "serve": "vite preview"
  },
  // ...

---

これで bun run dev で開発サーバーを起動できます。

bun run dev

---

次のコマンドは、アプリを本番環境用にビルドします。

bunx --bun vite build

---

これは Vite + Bun を始めるための最小限のガイドです。詳細については、Vite ドキュメント を参照してください。