Fullstack Pack

Appearance

Cloudflare 部署 ​

概述 ​

Cloudflare 部署使用 Cloudflare Workers（后端）和 Cloudflare Pages（前端），提供全球边缘计算能力。

前置要求 ​

  • Cloudflare 账户
  • GitHub 仓库（用于 CI/CD）
  • Prisma Accelerate 账户（用于数据库连接）

手动部署 ​

1. 后端部署（Cloudflare Workers） ​

1.1 设置环境变量 ​

bash
cd apps/server
wrangler secret put JWT_SECRET
wrangler secret put ACCELERATE_URL  # 或 DATABASE_URL

1.2 部署 ​

bash
pnpm deploy:server
# 或
cd apps/server
pnpm build
wrangler deploy

2. 前端部署（Cloudflare Pages） ​

2.1 构建 ​

bash
cd apps/web
pnpm build

2.2 部署 ​

bash
pnpm deploy:web
# 或使用 wrangler
wrangler pages deploy dist

2.3 配置环境变量（可选） ​

在 Cloudflare Pages Dashboard 中配置环境变量，详见各应用的 README。

3. 认证门户部署 ​

bash
cd apps/auth-portal
pnpm build
wrangler pages deploy dist --project-name=fullstackpack-auth-portal

4. 文档站点部署 ​

bash
cd apps/docs
pnpm build
wrangler pages deploy .vitepress/dist --project-name=fullstackpack-docs

注意：首次部署前需要先创建 Cloudflare Pages 项目。

自动部署（CI/CD）⭐ 推荐 ​

项目已配置 GitHub Actions，push 到 main 分支后会自动部署。

1. 配置 GitHub Secrets ​

在 GitHub 仓库设置中添加以下 Secrets：

  • CLOUDFLARE_API_TOKEN - Cloudflare API Token（需要 Account:Cloudflare Workers:Edit 权限）
  • CLOUDFLARE_ACCOUNT_ID - Cloudflare Account ID（可在 Dashboard 右侧找到）

获取 API Token：

  1. 访问 Cloudflare Dashboard
  2. 创建 Token，权限选择：
    • Account:Cloudflare Workers:Edit
    • Account:Cloudflare Pages:Edit
    • Zone:Zone:Read（如果使用自定义域名）

2. 配置 Cloudflare Workers 环境变量 ​

bash
cd apps/server
wrangler secret put JWT_SECRET
wrangler secret put ACCELERATE_URL

3. Push 代码触发部署 ​

bash
git push origin main

GitHub Actions 会自动：

  • 构建后端并部署到 Cloudflare Workers
  • 构建前端并部署到 Cloudflare Pages
  • 构建认证门户并部署到 Cloudflare Pages
  • 构建文档站点并部署到 Cloudflare Pages

注意：首次部署前，需要先创建 Cloudflare Pages 项目（见上方手动部署步骤）。

数据库配置 ​

Prisma Accelerate（推荐） ​

  1. 访问 https://accelerate.prisma.io/
  2. 注册并创建项目
  3. 获取 Accelerate URL
  4. 设置为环境变量：ACCELERATE_URL

数据库迁移 ​

bash
cd apps/server
npx prisma migrate deploy

自定义域名 ​

Workers（后端） ​

在 wrangler.toml 中配置：

toml
routes = [
  { pattern = "api.yourdomain.com/*", zone_name = "yourdomain.com" }
]

Pages（前端） ​

在 Cloudflare Pages Dashboard 中配置自定义域名。

注意事项 ​

  1. 环境变量：前端环境变量在 Cloudflare Pages Dashboard 中配置
  2. CORS：确保后端 CORS 设置允许前端域名
  3. HTTPS：Cloudflare 自动提供 HTTPS
  4. 路由：前端 SPA 路由需要在 Pages 中配置重写规则

Released under the MIT License.

Copyright © 2024