1. 基本信息
| 项目 | 内容 |
|---|---|
| 名称 | claude-skill-web-clone |
| 项目自述名称 | Web Clone · 网站复刻方法论 |
| 作者/维护者 | Jane（@xiaoerzhan） |
| 来源链接 | https://github.com/Jane-xiaoer/claude-skill-web-clone |
| 许可证 | MIT（GitHub API 获取） |
| GitHub Stars | 872（GitHub API 获取） |
| Forks | 106（GitHub API 获取） |
| 最新版本 | v1.6.0（2026-06-30 发布，GitHub Releases 获取） |
| 安装方式 | git clone 到本地 skills 目录 |
2. 功能介绍与亮点
这是一套“网站复刻方法论”skill：给一个网址，它不直接臆造“看起来对但跑不起来”的仿站代码，而是走一棵 6 步决策树先找真源码、再动手复刻。
核心能力：
- 真源码优先：先在 GitHub 上搜原站源码，找到且许可允许就直接用，找不到才进入侦察流程
- 按站型分流：静态站用
wget --mirror；React/Vue/Next 站重建模板灌内容；多页站先爬路由再设计模板 - WebGL/Canvas/Three.js 逐行逆向：配套
SOURCE/PARTIAL/GUESS三级证据分级，避免把 AI 猜测的实现当真架构抄 - 静态构建站 1:1 镜像：
mirror-site.mjs全程滚动捕获并镜像每个部署资产（含运行时加载的二进制） - 设计 DNA 提取：视觉复刻模式下，把目标站的设计 token、风格、特效蒸馏成可版本化的
design-dna.json - 许可证纪律：内置对照表，提醒公开部署前核实源码许可证，未声明时默认“保留所有权利”，仅供学习
亮点是随附一份“旗舰案例”文档，逐行拆解一个 1067 行的 WebGL 玻璃弹珠特效站，对比真实实现与 AI 分析文档的错误猜测，示范为什么必须核对真源码。
3. 适用场景
固定分类：工程效率与代码质量
- 想学习某个网站/交互 demo 的实现原理，逐行核对而非靠 AI 猜测
- 想把心仪站点的视觉/交互复刻下来，替换内容做成自己的项目
- 需要把 WebGL/Canvas 重前端效果真正跑起来，而不是得到一份看似合理实则跑不动的代码
- 需要把静态构建站整体镜像下来离线使用或二次开发
- 面向能独立执行 shell 命令、愿意核对源码的中高级开发者
4. 跨 Agent 兼容性
| Agent | 结论 | 依据 |
|---|---|---|
| Claude Code | 原生支持 | README 明确标注为 Claude Code skill，给出标准安装路径 ~/.claude/skills/ |
| Codex | 原生支持 | README 正文与安装说明中两处明确提到 Codex 会加载 SKILL.md 执行 |
| OpenClaw | 未验证 | 抓取材料中未提及 |
| Hermes Agent | 未验证 | 抓取材料中未提及 |
5. 推荐理由
AI 生成的“网站复刻分析”经常读起来头头是道、跑起来全是坑——这个 skill 把“先拿真源码、再逐行核对”做成强制流程，覆盖从静态页到 WebGL 重前端的完整分支，还把容易被忽略的许可证核实做进默认流程，能省下大量“复刻出来但效果不对”的返工时间。
6. 评分
| 维度 | 分数 | 说明 |
|---|---|---|
| 受欢迎程度 | 6 | 872 stars、106 forks，在“AI 网站复刻类”skill 的细分赛道中断层领先（同类项目普遍个位数到二十余星）；被第三方技能聚合仓库收录，但未见独立平台上的具名评论或活跃讨论帖 |
| 可用性 | 8 | 一条 git clone 命令即可安装，文档详尽且配实战案例，2026-06-30 发布过一次带完整 changelog 的功能更新，无付费依赖；唯一瑕疵是 SKILL.md 内引用了作者本机的绝对路径，跨机器使用需要手动改成自己的安装路径 |
| 安全性 | 8 | 见下方检查清单 |
安全检查清单：
| 检查项 | 结果 |
|---|---|
| ① Shell 命令与权限范围 | 有本地文件读写、wget/浏览器自动化等操作，全部围绕“复刻目标网站”这一目的，范围明确 |
| ② 运行时联网外发 | 仅拉取目标站点自身的公开资源与 GitHub 公开搜索接口，未发现向无关第三方外发数据 |
| ③ API key / 凭据 | 不要求任何 API key 或凭据 |
| ④ 可疑指令 | 抽查配套脚本源码未发现混淆代码或隐蔽外发逻辑 |
| ⑤ 作者信誉 | 个人开发者，GitHub 账号 2024 年注册、37 个公开仓库、107 关注者，非临时小号；提交历史与版本迭代记录完整 |
| ⑥ License | MIT，明确 |
| ⑦ 最近维护 | 最近一次功能更新 2026-06-30，距今约三周 |
7. 跟同类 Skills 相比的优势
| 项目 | 定位 | 与本技能的差异 |
|---|---|---|
| claude-skill-web-clone | 方法论 + 探针脚本，覆盖静态站到 WebGL 重前端的完整决策树 | —— |
| luukalleman/clone-study | 面向 Awwwards 级高端站点，走“截图分析→提取设计 token→用自己素材重建”路线 | 更偏视觉复刻，未覆盖 WebGL/Canvas 逐行逆向与真源码优先的强制核验环节 |
| Varalix-Digitech-Solutions/clone-team | 多 Agent 协作复刻，内置“不可跳过的测试闸门”，产出像素级还原 + 逆向架构文档 | 走多 Agent 分工路线，测试闸门验证的是“像素是否还原”，不像本技能那样强制核对真实源码、区分“SOURCE/PARTIAL/GUESS”证据等级 |
8. 用户评价
该技能目前在第三方平台尚无具名用户评价。GitHub 仓库本身暂无 Issue 或 Pull Request 记录。
9. 其他补充
仓库与 SKILL.md 均为中英双语撰写。作者在 references/ 目录中注明了对另外两个开源项目方法论的借鉴来源，署名清晰。
10. 安装使用方式
git clone https://github.com/Jane-xiaoer/claude-skill-web-clone.git ~/.claude/skills/web-clone安装后用自然语言触发，例如“复刻这个网站：https://…”，Claude Code / Codex 会自动加载 SKILL.md 并按决策树执行。脚本调用路径默认指向作者本机路径，使用前需替换为自己的实际路径；部分侦察步骤依赖浏览器自动化（Playwright MCP 或同类 Browser skill）。
11. 注意事项
- SKILL.md 脚本路径写死为作者本机目录，安装后须手动改成本地实际路径才能正常调用
- WebGL/Canvas 逆向分支对前端与图形学基础有一定要求，证据分级为 GUESS 时仍需人工判断
- 复刻结果涉及目标站点的版权归属，方法论提示了核实义务，但最终合规责任在使用者
- 仓库目前只有作者一人提交，尚无外部贡献者，长期维护可持续性有待观察