フロントエンドの開発サーバ起動とビルドを担います。変更時は該当モジュールだけを差し替える HMR が動き、画面反映がほぼ瞬時です。
技術用語
318
Vite
ヴィート
体験区分：少しだけ触った
推奨読者レベル：Level 3
何をしてくれるか
どこで出会うか
React・Vue・Svelte などで npm 経由でインストールします。`npm run dev` で開発サーバが立ち上がる場面や Bolt.new の内部で出会います。
Before / After
2026.04·ready
「Vite を使うと dev サーバが数秒で立ち上がり、HMR で即反映されますよ。」
Viteの見方
319
この用語の見どころ
1
役割
開発サーバの高速起動と、本番向けバンドルの両方を担います。
2
うれしさ
ファイル変更が画面に即反映され、待ち時間が大幅に減ります。
3
注意点
本番ビルドは Rollup を使い、開発時と動作差が出ることがあります。
4
どこで役立つか
React・Vue・Svelte など主要フレームワークの開発に使えます。
5
はじめに
`npm create vite@latest` でプロジェクトを作り `npm run dev` を試します。
6
深掘り先
Rollup、esbuild、HMR、ESM。
非エンジニアのつまずき
- 気づくと使われているツールですが、ログを見ると壊れていることもあります。
私のコメント
- 第一印象:「バイト」と読むのかと思っていたら「ビート」なんだ、という発見がありました。
- 良い点:意識しなくてもビルドをうまく処理してくれる安心感があります。
- ダメな点:正直まだよく分かっていません。
- 誰向けか:エージェント開発をしている人の多くがお世話になっているツールだと思います。
開発フローでの位置
プロジェクト作成
開発サーバ起動
コード編集
本番ビルド
関連用語
F-41·term_tool
バイブコーディング図鑑