Skip to content
AI Playbook

Cloudflare Pages 部署

Cloudflare Pages 部署

Section titled “Cloudflare Pages 部署”

說明

Section titled “說明”

AI Playbook 第一版是純靜態 Astro + Starlight 文件網站，部署目標為 Cloudflare Pages。

目前建議使用 Cloudflare Pages Git integration：把 Git repository 連接到 Cloudflare Pages，讓 Cloudflare 在每次 push 後自動執行 build 並部署 dist。

Why

Section titled “Why”

Cloudflare Pages 適合靜態文件網站，能提供自動建置、預覽部署與穩定 CDN。第一版不需要 SSR、Functions 或 Cloudflare adapter。

Git integration 比本機 Direct Upload 更適合這個專案，因為它可以保留部署紀錄、preview deployments 與 branch-based workflow。Direct Upload 可作為備案，但會把本機 build output 上傳到外部服務，必須先取得明確同意。

Current Status

Section titled “Current Status”
  • 本機 build 已通過。
  • Git remote 已設定：https://github.com/chengyunm1313/ai-playbook.git。
  • main branch 已推送到 GitHub。
  • Cloudflare Pages project 已建立：ai-playbook。
  • 已用 Direct Upload 完成部署。
  • Production URL：https://ai-playbook-4k0.pages.dev。
  • astro.config.mjs 已設定 site。

Build Settings

Section titled “Build Settings”

Cloudflare Pages 設定：

Setting Value
Framework preset Astro
Production branch main
Build command npm run build
Build output directory dist
Node.js version 22

本機部署前驗證：

Terminal window
npm run verify

Git Integration Flow

Section titled “Git Integration Flow”
  1. 建立或指定遠端 Git repository。
  2. Push main branch。
  3. 在 Cloudflare Pages 建立 project。
  4. 選擇 Git integration。
  5. 連接 repository。
  6. 設定 build command：npm run build。
  7. 設定 build output directory：dist。
  8. 設定 Node.js version：22。
  9. 部署完成後取得 Pages URL。
  10. 回到 astro.config.mjs 補上 site。
  11. 重新執行 npm run verify。
  12. Push site 設定，讓 sitemap 正常產生。

Direct Upload Flow

Section titled “Direct Upload Flow”

Direct Upload 只在使用者明確同意上傳後執行。

本機命令範例：

Terminal window
npm run build
npx wrangler pages deploy dist --project-name=<PROJECT_NAME>

注意：

  • 這會將 dist 內容上傳到 Cloudflare Pages。
  • 執行前要確認 dist 不包含私密資料。
  • 若要使用 Direct Upload，應先靜態檢查新增的 Wrangler 依賴或使用 npx 的版本來源。

Do

Section titled “Do”
  • 使用 Cloudflare Pages 連接 Git repository。
  • Build command 使用 npm run build。
  • Output directory 使用 dist。
  • Node.js 版本使用 22。
  • Cloudflare Pages 網址或正式網域確定後，在 astro.config.mjs 補上 site。
  • 部署前先執行 npm run verify。
  • 實際上傳前確認沒有 secret、token、.env 或私密資料進入 dist。

Don’t

Section titled “Don’t”
  • 不要為第一版加入 Astro Cloudflare adapter。
  • 不要在沒有 SSR 需求時引入 Workers Functions。
  • 不要在未確認正式網址前硬寫 sitemap site。
  • 不要在沒有明確授權時執行 Direct Upload。
  • 不要把 Cloudflare token、account id 或 project secret 寫入 repo。

Checklist

Section titled “Checklist”
  • 本機 npm run verify 可執行
  • Build command 設為 npm run build
  • Output directory 設為 dist
  • Node.js 版本設為 22
  • Git repository 已推送到遠端
  • Cloudflare Pages project 已建立
  • 已完成 Direct Upload 部署
  • 部署網址確定後補上 site
  • site 補上後 sitemap 可產生
  • Live smoke test 通過
  • 視需求改接 Git integration

References

Section titled “References”

Prompt Example

Section titled “Prompt Example”
請依 AI Playbook 的 Cloudflare Pages 部署文件，檢查目前專案是否具備可部署條件。


請輸出：
- Ready
- Blocked
- Required settings
- Verification commands
- External upload risks