بواسطة dsphper · dsphper/lanhu-mcp
Designed for the China design-to-code workflow: pulls 蓝湖 specs, marks 切图, and lets Claude write 前端 + 后端 from the spec.
Lanhu MCP exposes 蓝湖's design boards as MCP tools. Claude can fetch spec values (px sizes, colors, fonts), download slices, and use the structured spec to author React/Vue components or Mini Program pages.
%APPDATA%\Claude\claude_desktop_config.json{
"mcpServers": {
"lanhu-mcp": {
"command": "npx",
"args": [
"-y",
"lanhu-mcp"
],
"env": {
"LANHU_TOKEN": "${LANHU_TOKEN}"
}
}
}
}افتح Claude Desktop → Settings → Developer → Edit Config. أعد التشغيل بعد الحفظ.
{
"mcpServers": {
"lanhu-mcp": {
"command": "npx",
"args": [
"-y",
"lanhu-mcp"
],
"env": {
"LANHU_TOKEN": "${LANHU_TOKEN}"
}
}
}
}يستخدم Cursor نفس مخطط mcpServers مثل Claude Desktop. إعدادات المشروع أولى من الإعدادات العامة.
{
"mcpServers": {
"lanhu-mcp": {
"command": "npx",
"args": [
"-y",
"lanhu-mcp"
],
"env": {
"LANHU_TOKEN": "${LANHU_TOKEN}"
}
}
}
}انقر على أيقونة MCP Servers في شريط Cline الجانبي، ثم "Edit Configuration".
{
"mcpServers": {
"lanhu-mcp": {
"command": "npx",
"args": [
"-y",
"lanhu-mcp"
],
"env": {
"LANHU_TOKEN": "${LANHU_TOKEN}"
}
}
}
}نفس الصيغة مثل Claude Desktop. أعد تشغيل Windsurf لتطبيق التغييرات.
{
"mcpServers": [
{
"name": "lanhu-mcp",
"command": "npx",
"args": [
"-y",
"lanhu-mcp"
]
}
]
}يستخدم Continue مصفوفة من كائنات الخادم بدلاً من خريطة.
{
"context_servers": {
"lanhu-mcp": {
"command": {
"path": "npx",
"args": [
"-y",
"lanhu-mcp"
]
}
}
}
}أضف إلى context_servers. يعيد Zed التحميل تلقائيًا عند الحفظ.
claude mcp add lanhu-mcp -- npx -y lanhu-mcpأمر من سطر واحد. تحقق باستخدام claude mcp list. احذف باستخدام claude mcp remove.
متى تستخدمه: 设计师 just shipped a board; you want the component scaffolded with correct tokens.
النتيجة: Component matches the spec without you eyeballing pixel values.
Save downloaded slices into your project tree
| الأداة | المدخلات | متى تستدعيها | التكلفة |
|---|---|---|---|
| get_board | (see docs) | Fetch a design board structure + specs | 1 call |
| download_slices | (see docs) | Download annotated slice assets | 1 call |
| export_tokens | (see docs) | Export design tokens as JSON/CSS variables | 1 call |
lanhu:read401 from LanhuToken expired or wrong project scope; regenerate in Lanhu settings
Slice download empty设计师 hasn't marked slices — ask them to mark 切图 in the board
| البديل | متى تستخدمها | المقايضة |
|---|---|---|
| figma MCP | Source is Figma | Different design tool |
| stitch-mcp | Source is Google Stitch | Different design tool |