记录从 Replit 平台迁移到 Vercel

44 阅读4分钟

Gemini Generated Image (4).png Replit 虽然好用,但真的还是太贵了,并且相当于你和他的平台做捆绑了,所以第一版跑出来以后我就想着一定要从 Replit 迁移出来。

但是鉴权、数据库、部署、大模型调用等,这些在是用 Replit 的时候是不需要操心的,真的很舒服,一旦迁移出来,这些都得自己准备好。

我选择了:

  • 鉴权:Google OAuth2.0
  • 数据库:Supabase(目前还是 FREE)
  • 部署:Vercel(目前还是 Hobby)
  • 大模型:OpenAI(这个我暂时不改)

选型也都是市面上流行的,和大模型简单沟通下就定下来了,并不困难,但实际要怎么操作呢?

小试 Kiro

还是秉持着 “AI 还是太好用的原则” 加上最近亚马逊的 Kiro 投流挺多,我就想试试 Kiro 的 Spec Coding。

先说结论:不行,并没有完成我的任务

但我还是要叠个甲,可能是我是用的姿势还是不够。

我的提示词是:

这个项目是我完全使用 Replit 创建出来的,名字是 zen-lingo,是一个极简的英语学习产品。

需求背景是 Replit 按用量付费太昂贵,我有点承担不起,所以我现在急需把这个项目改造一下,
变成我可以自己部署到 Vercel。

需求难点是在 Replit 中有很多现成的功能(比如:数据库、AI 大模型调用)我都不需要操心,
Replit 都帮我搞定了,但是如果我要从他们平台撤出来,势必要经过一番改造。

我改造的需求如下:

1. 请你彻底弄懂原有代码的结构和业务逻辑以及技术栈,可以查看任何你想要查看的文件

2. 弄清楚原有代码有多少的外部依赖(数据库、AI API_KEY 等)这些外部依赖相关的
配置我需要全部抽取到 .env 文件中

3. 目前这一版我需要部署到 Vercel 的平台上,所以 Vercel 平台部署的脚本和配置
我也需要你来编写

4. 不修改目前代码逻辑的前提下帮我完成平台的迁移

5. 你有任何疑问需要我来补充的可以反问我

结果,Kiro 给我一顿操作猛如虎,又是 design 又是 requirements 再 tasks,我都感觉分分钟我要失业了。

image.png 最后是卡在了两个错误之间反复横跳:修复好了错误 A 就出现了错误 B,修复好了 B 之后又出现错误 A。

最后我亲自下场查看问题,但是因为我本人是后端程序员,前端并不熟悉,只能再次求助 G 老师(ChatGPT),反复折腾了 2 小时还没搞定,我本地运行 npm run dev 都打不开首页,最终决定放弃。

再试 Codex

我把代码回滚到 Replit 的最后一次提交的状态之后,把相同的提示词发送给了 Codex

image.png

他先给我梳理了一通(太长就不贴全了)

最后他反问了我他的疑问

image.png

我一一回答之后,就让他开干了。

结束了开发之后,我本地运行简单报了几个小错修复之后,localhost:3000 至少可以打开了,能看到首页了,我又改了一些和 Auth 和数据库相关的配置之后,我本地把功能都验证了一遍了(登录 → 操作 → 订阅等)都是没问题的。我就提交 git 保存版本了。

然后我就准备往 Vercel 上部署了,这个过程又发生了一点曲折,但最终还是搞定了(还是花了 2 个晚上),原因我就让大模型帮我总结了一下:

部署失败的关键因素

函数缺少服务端代码:Vercel 只打包 api/index.ts,需要在 vercel.json 里用 includeFiles 把 server/** + shared/** 拷进函数,
否则 createApp 无法 import,导致 /api/auth/user 500。

缺少 passport-google-oauth20 类型:TypeScript 报 TS7016,必须安装 @types/passport-google-oauth20 
或添加 types/passport-google-oauth20.d.ts,并让 tsconfig.json 读到它。

生产环境变量不全:Vercel 上没有设置 DATABASE_URL、SESSION_SECRET、GOOGLE_CLIENT_ID/SECRET、BASE_URL 等,
server/auth.ts 的 assertEnv 会抛错,函数运行时直接失败。

vercel.json 配置不合法:最初没有指定 runtime、includeFiles 还写成数组,Vercel 
抛 “includeFiles should be string”“Function Runtimes must have a valid version”,部署直接被拒。

迁移完成

当我可以在浏览器中再次打开 zen-lingo.com ,流程都验证一遍后,真别提有多爽了

image.png

迁移完成之后,我就可以继续去开发新特性了,我目前决定先做的有:

  • 首页增加联系方式
  • 增加国内支付方式(支付宝)
  • 增加更多的大模型路由(不绑死在 OpenAI)
  • 增加句子解析模式
  • 小的性能优化