Code gen
Extract Lanhu design HTML, CSS, and assets through Lanhu MCP for Claude Code design-to-code workflows. Called by design-to-code.From its SKILL.md
npx -y skills add ursazoo/lanhu-to-code --skill code-genAssembled from the repository path, not quoted from the project. Check it against their README if it does not work.
2 things to look at
- no licenseNo license file was found in the repository. Code published without one is not open source by default, so using it at work is a question for whoever answers licensing questions where you are.
- 19 stars19 stars. Stars are a popularity signal and not a quality one, but at this level it is likely that nobody has read this closely except its author, and you would be relying on your own review.
SKILL.md
1.8 KB, 535 tokens by cl100k_base, as published. Nobody here has run it
code-gen
职责: 从蓝湖 MCP 获取设计稿数据,保存到固定路径,供 code-format 消费。
不做: 转换框架代码、分析业务逻辑、引入项目上下文。
执行步骤
-
判断 URL 是否指向具体页面
- URL 含
&id=或&did=参数 → 有具体页面,直接取 design_id - URL 只有
pid=(项目级)或只提供了名称 → 调用lanhu_get_designs获取设计图列表,展示给用户选择,等用户确认后才继续
展示格式:
该项目共有 N 个设计图,请选择要转换的页面: 1. 页面名称A 2. 页面名称B 3. 页面名称C ... 请输入序号: - URL 含
-
用确认的 design_id 调用
lanhu_get_ai_analyze_design_result,等待 status=completed(异步,需轮询) -
调用
lanhu_get_design_slices,下载切图到assets/ -
保存产物到
.claude/lanhu-output/<页面名称>/ -
返回路径摘要给调用方
输出约定
.claude/lanhu-output/<页面名称>/
├── index.html
├── style.css (如有)
└── assets/
返回格式:
路径:.claude/lanhu-output/<页面名称>/
切图:N 个
主要元素:<3-5 行简述顶层结构>
关键陷阱
lanhu_get_ai_analyze_design_result是异步的,必须等 status=completed 再读- design_id 不能猜,必须从
lanhu_get_designs返回值中取 - 项目级 URL(只有 pid)不能自动选第一个,必须展示列表让用户选
lanhu_get_pages是 Axure 原型页面接口,不是设计稿,不要混用
What ships with it
Read from the repository
Just SKILL.md. No reference files, no scripts.