Next.js 网站 Vercel 部署清单：从本地到上线

本地 npm run dev 能跑，不等于能上线。这份清单帮你一次部署成功。

部署前检查

• npm run build 本地通过
• .env.local 未提交 Git（使用 Vercel 环境变量面板）
• NEXT_PUBLIC_SITE_URL 设为生产域名

Vercel 步骤

1. Import GitHub 仓库
2. Framework Preset 选 Next.js
3. 在 Settings → Environment Variables 填入 Supabase、Stripe、Resend 密钥
4. Deploy

环境变量分组

变量	环境
NEXT_PUBLIC_*	Production + Preview
STRIPE_SECRET_KEY	仅 Production（测试可用 Preview 测试 key）
STRIPE_WEBHOOK_SECRET	Production 与 CLI 本地各一套

自定义域名

在 Vercel Domains 添加域名后，按提示配置 DNS（推荐 CNAME 到 cname.vercel-dns.com）。
Supabase / Stripe 的 Redirect URL 记得同步改为 https://你的域名.com/...。

构建失败常见原因

• Edge 不兼容：Stripe Webhook 需 runtime = 'nodejs'
• 缺少 env：构建期访问 process.env 未定义
• TypeScript 错误：本地先 npm run build

更多内容

完整部署章节见 实战项目：项目初始化。需要手把手视频？查看课程。