星标数:39102★ Fork数:5814 《ai-website-cloner-template:用 AI 编程代理一条命令复刻任意网站为 Next.js 应用》

AI Website Cloner Template 是一个开源模板项目,它的核心理念是:把任意网站的 URL 交给你的 AI 编程代理,然后看着它把该网站重建成一个干净的 Next.js 应用。用 README 的原话说,就是 “Clone any website with one command”——一条命令克隆网站。

ai-website-cloner-template 项目截图

根据项目说明,使用 Claude Code + Opus 5.5 能获得最佳效果,同时它也支持 Codex、Cursor 和 OpenCode 等其他 AI 编程代理。项目采用 MIT 许可证开源。

模板本身基于现代技术栈构建,克隆过程遵循一套结构化的工作流程,从映射路由、观察页面,到构建组件、对比修正,最终交付可运行的代码与对比截图。

主要特点

  • 一条命令(/clone-website + URL)即可让 AI 代理复刻网站为 Next.js 应用
  • 支持多个 AI 编程代理:Claude Code(推荐)、Codex CLI、OpenCode、Cursor
  • 四步工作流:Map(映射路由)、Observe(观察页面与资源)、Build(构建可编辑组件与交互)、Compare(对比源站与本地页面并修正差异)
  • 技术栈现代:Next.js 16(App Router、React 19、TypeScript strict)、shadcn/ui + Tailwind CSS v4、Lucide React 图标
  • 内置使用场景:平台迁移(WordPress/Webflow/Squarespace 迁移到 Next.js)、找回丢失的源码、学习生产站点的布局与动画实现
  • 明确的使用边界:禁止用于钓鱼或冒充、禁止将他人设计据为己有、需遵守目标网站的服务条款

快速开始

第一步,创建项目。推荐做法是直接把下面这段话粘贴给你的 AI 代理,让它完成初始化:

Set up https://github.com/JCodesMore/ai-website-cloner-template
as a standalone project in a new folder on my computer.
Ask me where to put it. Clone the repository, remove its origin remote,
install dependencies, and run npm run check. Leave it ready for me
to clone a website.

也可以点击 GitHub 上的 “Use this template” 按钮创建自己的仓库,然后让代理克隆它、安装依赖并运行 npm run check。

第二步,克隆网站。在你的代理中打开项目并启用浏览器访问,然后运行:

/clone-website https://example.com

把 URL 换成你想复刻的网站即可。构建完成后,你可以继续向代理提出任何修改需求。

环境要求

  • Node.js 24+
  • 一个 AI 编程代理(Claude Code、Codex CLI、OpenCode 或 Cursor)

常用命令

npm run dev        # 启动开发服务器
npm run build      # 生产构建
npm run lint       # ESLint 检查
npm run typecheck  # TypeScript 检查
npm run check      # 运行 lint + typecheck + build

如果使用 Docker:

docker compose up app --build   # 构建并运行应用
docker compose up dev --build   # 以开发模式运行,端口 3001

📊 本项目 GitHub 星标数:39102。最后更新:2026-11-10,发布:2026-10-05。项目地址:https://github.com/JCodesMore/ai-website-cloner-template

100T高转存免费网盘资源精选【持续更中~~~~】:点击查看

0 0 投票
文章评级
订阅
提醒
guest
0 评论
内线反馈
查看所有评论
0
希望你的想法,请评论。x