Install any skill in seconds. Free to start, no credit card required.
Get Started Free →nexu-io/web-clone
网站复刻 / 克隆方法论。USE WHEN 用户说 复刻网站、克隆网站、clone website、抄个站、仿站、 照着这个站做一个、reproduce site、还原某个网页效果、把这个站搬下来改成我的、 复刻某个交互/WebGL/Canvas/Three.js 效果。提供「先拿真源码 → 判路径 → 逆向拆解 → 搭工程 → 替换内容」的可移植决策树,覆盖静态站 / React-Vue-Next 内容站 / WebGL-Canvas 重前端站三大分支,并强制核对任何 AI 二手分析里的可执行代码。
Passed 14 of 19 test cases with the skill, and 5 of 19 without it.
and 9 more in the full report
10 fixed6 passed either way6 still failing0 broke
Tokens, turns and time describe resource use, not a dollar price.
One of 10 test cases the skill fixed. Same model, same prompt, with and without the skill.
We ran our clone verification and audit script. Which CLI flag enforces strict failure (exit code 2) if fonts are missing self-hosting or computed colors deviate from the recon JSON?
| Checked | Without skill | With skill |
|---|---|---|
| Specifies passing the --strict flag to scripts/audit-clone.mjs. | Missed | Passed |
The instructions your model reads when the skill loads.
把"复刻一个网站"做成可重复的流程。在 OpenDesign 中,默认在当前项目目录工作:NOTES.md、RECON/、CLONE_REPORT.md、CLONE_AUDIT.md 和最终可预览的 index.html 都应写在当前项目内,除非用户明确指定外部工作目录。
OpenDesign 环境准备(跑任何 scripts/ 前先看):
.od-skills/<插件目录>/scripts/(skill 前言里有确切路径)。文中命令写的 node scripts/xxx.mjs 按该路径解析,例如 node .od-skills/<插件目录>/scripts/recon-site.mjs ...;RECON/、assets/ 等产物仍写到项目根。od CLI。Agent 沙箱内会通过本地 daemon 创建临时 CDP 会话,避免沙箱阻止 Chrome 子进程。禁止在用户项目里执行 npm install playwright 或下载 Chromium。 若预检报告没有兼容浏览器,直接说明缺少系统浏览器或通过 OD_BROWSER_EXECUTABLE_PATH 指定路径,不要改为目测,也不要反复安装依赖。源码开发环境若已经提供 OD_PLAYWRIGHT_PACKAGE,脚本仍兼容该运行时,但它不是产品链路的前置条件。任何 AI 生成的"复刻分析/施工图",正文的概念骨架可以参考,但里面的可执行代码块默认全是臆造的,必须逐行用真源码核对,否则照抄必崩。
实证(marbles 案例):一份 AI 分析文档把原站"解析法求光线-球体交点 + 把光学结果编码成位移图、交给 SVG feDisplacementMap 去扭曲真实 DOM"的真架构,臆造成了"ray-marching + SDF + 把 DOM 当纹理采样"——两套完全不同的实现,照抄做不出原效果且慢 N 倍。详见 references/marbles-case.md。
所以第一动作永远是:拿到真源码。
node scripts/init-clone.mjs <站名> --url <原站URL> --in-place
该脚本会在当前项目内创建 NOTES.md、RECON/screenshots/,避免每次手工漏掉产物。
unset SSL_CERT_FILE # macOS 怪癖,bash 前先解
# 按站名/产品名搜
SSL_CERT_FILE=/etc/ssl/cert.pem gh api "search/repositories?q=<关键词>" \
| jq -r '.items[] | "\(.full_name) ⭐\(.stargazers_count) \(.description)"' | head -10
# vercel.app/netlify.app/github.io 的 URL slug 常常就是 仓库名 / 部署者用户名
curl -sL https://raw.githubusercontent.com/<user>/<repo>/main/index.htmltest cases passed, vs 5 / 19 without
Published skills whose descriptions closely match this one, with their headline benchmark lift.
More skills from the same source and nearby in the registry, with their headline benchmark lift.