Bun

指南生態系統

使用 Vite 和 Bun 建立前端

雖然 Vite 目前可與 Bun 搭配使用,但尚未進行大量最佳化,而且 Vite 尚未調整為使用 Bun 的套件組建器、模組解析器或轉譯器。

Vite 可與 Bun 立即搭配使用。從 Vite 的其中一個範本開始。

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 旗標會指示 Bun 使用 bun 而不是 node 來執行 Vite 的 CLI;預設情況下,Bun 會尊重 Vite 的 #!/usr/bin/env node shebang 行

bunx --bun vite

若要簡化此指令,請將 package.json 中的 "dev" 腳本更新為下列內容。

package.json
"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 文件