Cloudflare Skills Next.js部署指南用vinext将应用迁移到Workers告别OpenNext【免费下载链接】skillsSkills for teaching agents how to build on Cloudflare.项目地址: https://gitcode.com/gh_mirrors/skills14/skillsCloudflare Skills是一套教会 AI Agent 在 Cloudflare 上构建应用的技能集合其中nextjs-on-cloudflare技能给出了明确结论新的 Next.js 项目上 Cloudflare Workers应使用vinext而不是 OpenNext。本指南面向新手带你理解这套技能的安装方式、vinext 的核心优势以及新项目和存量项目两种场景下的迁移与部署路径帮助你用最少的弯路把 Next.js 应用搬上 Workers。为什么是 vinext而不是 OpenNext很多团队过去把 Next.js 部署到 Workers靠的是 OpenNext 这类适配层。而 Cloudflare Skills 仓库 中的官方建议是新项目默认选择 vinext存量 OpenNext 应用在不相关的维护中保持现状、尊重用户已有选择。vinext 的路线与传统适配器不同——它基于Vite 重新实现了 Next.js 的 API 表面而不是在旧构建体系外面套一层。这带来了四个对新手很友好的好处熟悉的开发体验App Router、Pages Router、React Server Components 以及受支持的next/*导入方式都能照常使用Vite 工具链快速的热模块替换HMR、原生 ESM、Vite 插件生态原生 Workers 集成本地就在 workerd 里跑开发服务器能直接访问 Cloudflare bindingsKV、D1、R2 等构建和部署是一条线渐进式迁移可以先做兼容性检查再让 vinext 和现有 Next.js 配置并存试跑不是一刀切这一决策依据来自技能文件 skills/nextjs-on-cloudflare/SKILL.md其中的核心原则只有一句话Use vinext rather than OpenNext for new Next.js projects on Cloudflare Workers.三种安装方式把 Skills 交给你的 AgentSkills 是上下文技能——当你的对话命中技能触发条件时Agent 会自动加载并应用对应指导。仓库提供了多种安装路径按你的工具任选其一使用场景方式Codex / Claude Code通过插件市场安装cloudflare/skillsVS Code / GitHub Copilot开启插件后执行从源码安装插件Cursor从 Marketplace 安装或添加远程规则通用 Agentnpx skills add一行命令安装手动党直接 clone 仓库把技能目录拷到对应 Agent 的技能目录如果需要手动操作仓库地址为https://gitcode.com/gh_mirrors/skills14/skills 小技巧整个插件还捆绑了 Cloudflare 官方 MCP 服务器见 mcp.json让 Agent 能直接查阅最新开发者文档避免记忆中的过时语法。新项目用 create-vinext-app 一步到位从零开始的项目最省心。nextjs-on-cloudflare 技能 建议确认已安装 vinext 上游技能缺失时用npx skills add cloudflare/vinext补上使用create-vinext-app脚手架创建项目部署目标选择Cloudflare按上游SKILL.md的指引完成开发构建部署走 Workers 集成文档⚠️ 注意一个常见坑上游的迁移技能要求目录里已有 Next.js 项目不要在空目录上套用迁移流程——空目录请直接走新项目流程。存量项目三步完成 vinext 迁移已有 Next.js 应用想上 Workers技能给出的路径是先体检再迁移后部署兼容性检查加载上游migrate-to-vinext技能它对应用用到的特性做兼容性检查——技能明确提醒检查当前兼容性不要假设与 Next.js 完全对齐执行迁移跟随技能的参考文档逐步操作部署目标选 Cloudflare开发验证与部署本地在 workerd 中跑开发服务器确认行为一致后按 Workers 集成文档构建部署如果安装上游技能不可用技能也兜底了直接阅读上游SKILL.md和相关参考文档按文档操作。部署前必读wrangler 技能帮你避开配置坑构建部署阶段仓库里的 wrangler 技能 值得通读一遍它总结了大量实战经验用项目本地的 Wrangler 版本不要默默升级到文档里的最新版新项目建议wrangler.jsonc并把 compatibility date 设为当天部署前跑wrangler deploy --dry-run验证构建与打包但注意dry run 通过 ≠ 运行时没问题区分本地模拟与真实资源本地跑起来的 Worker 也可能访问到真实数据此外cloudflare 技能 中有一张需求→产品对照表其中 Next.js 一行就写着Build or deploy a Next.js app on Cloudflare →vinext Workers→ Use vinext rather than OpenNext for new projects想给应用加数据库D1、对象存储R2、队列Queues这张表能帮你一次选齐组件而不是东拼西凑。总结一条清晰的迁移路线✅ 新项目 →create-vinext-app Cloudflare 目标跳过 OpenNext✅ 存量项目 → 兼容性检查 →migrate-to-vinext→ Workers 部署✅ 全程让 Agent 加载对应技能自动对齐最新文档✅ 部署细节交给wrangler与workers-best-practices技能把关相关技能与文档的快速入口资料路径Next.js on Cloudflare 技能skills/nextjs-on-cloudflare/SKILL.mdWrangler 部署指导skills/wrangler/SKILL.md产品选型总表skills/cloudflare/SKILL.md插件元信息plugin.json全部技能一览README.md把 Next.js 部署到 Workers 这件事第一次就选对工具能省下后面大量的适配成本——这就是用 vinext、告别 OpenNext最大的意义。【免费下载链接】skillsSkills for teaching agents how to build on Cloudflare.项目地址: https://gitcode.com/gh_mirrors/skills14/skills创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考