用途:把指定的灵感网站复刻成可用的落地页,再替换为用户自己的业务内容并部署上线,全流程由该技能引导完成。
主要能力:内置 agent-browser 做页面抽取(整页与分段截图、读取计算样式、HTML 结构与移动端视图),据此还原页面;用 Next.js + shadcn/ui 建站并支持预览面板选中元素;可自动生成图片;可部署到 Vercel 并提供分享链接。
使用流程:分为五个阶段——阶段0静默检查 GEMINI_API_KEY 与 nano-banana MCP 配置;阶段1提10个入场问题(含灵感站点URL);阶段2精确克隆并部署,逐段“构建-截图-比对-修正”;阶段3用一张合并表单收集所有板块所需的真实内容;阶段4逐段改写文案(提供标题选项)并最终以 npx vercel --prod 发布;阶段5仅在缺少密钥时引导获取并保存 Gemini API key 到 .env。
必要命令:node <skill-dir>/scripts/generate-image.mjs --prompt "..." --output public/images/filename.png --aspect 16:9;claude mcp add nano-banana -s stdio --scope global -- npx -y @zhibinyang/nano-banana-mcp;npm i -g agent-browser && agent-browser install。
限制与说明:图片槽位要求生成真实图片,禁止用占位图、渐变或 SVG 替代,两者都失败时留 <!-- IMAGE NEEDED: ... --> 注释并告知用户;克隆阶段不使用组件库以保证还原度;若阶段0未发现密钥会直接跳到阶段5,保存后需新开会话再运行 /website-launch-kit。具体收费、价格与效果暂未提供。