部署 nextjs、nuxt vue 到 Cloudflare Page 遇到的坑爹问题，时间和金钱都浪费了

大家可能会说，时间和金钱都浪费了，这么大成本，为什么不在 vps 或者 Dokploy 上部署。

其实是 Cloudflare 这个菩萨太香了，几乎 0 成本服务器费用，尤其我们要多做项目，这样从成功率更容易成功，所以成本对我们很重要。万一哪个项目火了，我们可以再去宠幸那个项目。

最近使用 Cloudflare Page 部署项目，遇到部署问题，代价很大。交的学费就是，白白浪费 1 天或几天的时间，到最后还是解决不了这个部署问题，真的很抓狂。接下来我会告诉下唯一的、反直觉、速效的方案。

其实方案很简单，就是项目做一些改动，尤其大的，要 Cloudflare page 部署一次，如果是线上产品，那就直接非主分支部署，这样只会部署到 preview 分支，不会影响到线上的业务。

这样如果遇到部署的问题，解决当下的改动或最近的小改动就行了。

不这样做的代价可能就是以半天的时间为单位浪费，可能还解决不了问题，你说抓不抓狂。而我遇到了两次这样的大问题，这一次更是浪费是时间和钱财，我会告诉你具体的情况。

我这次是等项目完成之后，想一步 deploy 到 Cloudflare 成功，结果处理了一天都没解决。各种问 AI ，结果 3 分钟，加上 cursor 刚更新，新的调用计费政策，cursor o3 就耗光了一个月的额度，损失几十刀。时间和金钱都浪费了。

下面两张图是 cursor 的 o3 调用和扣费，当时就把 o3 model 禁了，用不起用不起。

最后我只能沿着 git 提交记录排查，结果最近一次成功部署在 35 次提交之前，很绝望。直接原因是引入了 shadcn-nuxt 这个库，非官方库，某种原因就是部署不了。

那只能从那个 git 提交点开始改动了，这是最笨又快速方法。毕竟这么多提交记录，变量太大了，AI 也懵逼了，我浪费了时间和 AI 费用，结果问题还是没有解决。

我上次遇到类似的问题，是部署 nextjs 项目到 Cloudflare page ，哎，结果这次是 nuxt vue 项目，我以为不一样，结果一样折磨我一天时间，最后只能回到之前的 git 提交点，一步一步几十个提交记录，再手工去搬运。

这是我遇到的 Cloudflare 的两次部署问题，耗费了大量代价：时间和金钱成本，总结出的解决方案，希望可以帮到大家避坑，谢谢~

也分享记录在了 X: https://x.com/meigesir/status/1923186773833707947

sdrpsps

117 天前

Nuxtjs 没用过不了解...
现在在 Cloudflare 上部署 Nextjs 有两种方式：
1. Cloudflare Pages （使用 @cloudflare/next-on-pages 这个库）
2. Cloudflare Worker （使用 @opennextjs/cloudflare 这个库，更新）

我个人用下来是使用 Cloudflare Worker 来部署是最好用的，因为 Pages 能做到的 Worker 也能做到。

在编码过程中，使用 Pages 需要到处 `export const runtime = 'edge';` 才能正常调用 Cloudflare D1/R2 之类的 API ，并且在 edge runtime 也使用不了一些功能；但使用 Worker 就不需要了，对照文档该怎么写就怎么写，不用再考虑 runtime 的东西了。

在部署前，完全可以先在本机 build 一遍，找到问题再部署嘛