返回博客
Vercel部署Next.js
Next.js 网站 Vercel 部署清单:从本地到上线
环境变量、域名、预览环境与常见构建失败排查,助你 30 分钟内部署上线。
2026年5月5日约 3 分钟阅读
本地 npm run dev 能跑,不等于能上线。这份清单帮你一次部署成功。
部署前检查
-
npm run build本地通过 -
.env.local未提交 Git(使用 Vercel 环境变量面板) -
NEXT_PUBLIC_SITE_URL设为生产域名
Vercel 步骤
- Import GitHub 仓库
- Framework Preset 选 Next.js
- 在 Settings → Environment Variables 填入 Supabase、Stripe、Resend 密钥
- 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
更多内容
完整部署章节见 实战项目:项目初始化。需要手把手视频?查看课程。