Vite 8.1 がリリースされた。モジュール数の多い巨大アプリ向けに、開発時もバンドルして配信する実験的な Bundled Dev Mode（旧称 Full Bundle Mode）が使える。--experimental-bundle、または設定の experimental.bundledDev: true で有効化する。10,000 個の React コンポーネントを読み込むアプリでの初期計測では、非バンドルの開発サーバ比で起動が約 15 倍、フルページリロードが約 10 倍速く、HMR はアプリ規模に依らず即時だった。Linear ではコールドスタート描画が最大約 3 倍、フルリロードが約 40% 速く、ネットワークリクエストが約 10 分の 1 になった。いまはブラウザ側と基本プラグイン・主要機能が対象で、サードパーティプラグインや一部のマイナー機能は未対応の場合がある。

ts
import { defineConfig } from 'vite'

export default defineConfig({
  experimental: {
    bundledDev: true,
  },
})

そのほかの主な変更は次のとおり。

  • 実験的な build.chunkImportMap。チャンク間の import にハッシュを埋め込まず import map 経由にすることで、依存チャンク更新時のハッシュ連鎖更新を抑えキャッシュ効率を上げる。experimental.renderBuiltUrl とは併用できない
  • Wasm ESM integration 提案に沿い、.wasm を直接 import してエクスポート関数を呼べる
  • Lightning CSS 向けに、CSS からの外部 CSS import とプラグインによるファイル依存登録が使える。次のメジャーで既定 CSS 変換を Lightning CSS にする方針が示されている
  • import.meta.glob に caseSensitive オプションが付き、大文字小文字を区別しないマッチができる
  • html.additionalAssetSources で、事前定義以外の HTML 要素・属性からもアセットを解決できる
ts
import { add } from './add.wasm'

console.log(add(1, 2)) // 3

#参考文献