Bun 開箱即支持 .jsx 和 .tsx 文件。React 可以在 Bun 上直接運行。
使用 bun init --react 創建一個新的 React 應用。這將為你提供一個模板,包含一個簡單的 React 應用和一個簡單的 API 服務器,整合在一個全棧應用中。
bash
# 創建一個新的 React 應用
bun init --react
# 以開發模式運行應用
bun dev
# 構建為靜態站點用於生產
bun run build
# 以生產模式運行服務器
bun start熱重載
運行 bun dev 以開發模式啟動應用。這將啟動 API 服務器和帶有熱重載功能的 React 應用。
全棧應用
運行 bun start 在一個進程中同時啟動 API 服務器和前端。
靜態站點
運行 bun run build 將應用構建為靜態站點。這將創建一個 dist 目錄,包含構建好的應用和所有資源。
txt
├── src/
│ ├── index.tsx # 帶有 API 路由的服務器入口點
│ ├── frontend.tsx # 帶有 HMR 的 React 應用入口點
│ ├── App.tsx # 主要 React 組件
│ ├── APITester.tsx # 用於測試 API 端點的組件
│ ├── index.html # HTML 模板
│ ├── index.css # 樣式
│ └── *.svg # 靜態資源
├── package.json # 依賴和腳本
├── tsconfig.json # TypeScript 配置
├── bunfig.toml # Bun 配置
└── bun.lock # 鎖定文件