lanhu-context-mcp
lanhu-context-mcp
简体中文 | English
✨ Преобразует макеты Lanhu в контекст, позволяющий ИИ генерировать код для восстановления страниц.
Функции
🎨 Поддержка вывода
HTML+CSSилиHTML+Tailwind, возможность выбора наиболее подходящего формата в зависимости от технологического стека проекта🖼️ Возврат сопоставления ресурсов изображений и команд для скачивания, что сокращает количество ручных действий по обработке ресурсов
🧱 Дополнение
Design Tokensи превью дизайна для облегчения реализации и визуальной проверки последующими моделями🧭 Включение руководств по реализации для ИИ с указанием приоритетов, способов адаптации и ограничений
⚙️ Поддержка настройки вывода
Tailwind, пропуска изображений, масштабирования единиц измерения и языка подсказок через параметры CLI и переменные окружения
Related MCP server: lanhu-mcp-server
Документация
Полную документацию можно найти на сайте lanhu.refineup.com.
Быстрый старт
Системные требования
Node.js
^20.19.0 || >=22.12.0
Преобразование макетов
Для макетов необходимо сначала включить функцию транскодирования, а затем загрузить их в Lanhu
Шаг 1. Подготовка переменных окружения
Сначала создайте файл .env.local.
Вам понадобится действующий токен для входа в Lanhu, см. Получение токена Lanhu.
LANHU_TOKEN=your_lanhu_token_hereШаг 2. Настройка MCP
Добавьте конфигурацию MCP для соответствующего клиента в нужный файл:
Codex (.codex/config.toml)
[mcp_servers.lanhu-context-mcp]
cwd = "/absolute/path/to/current-project"
command = "npx"
args = ["-y", "lanhu-context-mcp"]Claude Code (.mcp.json) / Cursor (.cursor/mcp.json)
{
"mcpServers": {
"lanhu-context-mcp": {
"command": "npx",
"args": ["-y", "lanhu-context-mcp"]
}
}
}Конфигурация MCP для Codex является специфической: необходимо дополнительно задать cwd и указать в нем абсолютный путь к текущему проекту. Поскольку этот путь обычно индивидуален, не рекомендуется добавлять .codex/config.toml в Git; лучше добавить его в исключения Git и поддерживать локально каждым разработчиком.
Windows
Если запуск с использованием конфигурации npx выше в Windows завершается ошибкой, можно использовать следующий вариант:
Codex (WSL2)
[mcp_servers.lanhu-context-mcp]
cwd = "/absolute/path/to/current-project"
command = "npx"
args = ["-y", "lanhu-context-mcp"]Codex (Native)
[mcp_servers.lanhu-context-mcp]
cwd = "C:\\absolute\\path\\to\\current-project"
command = "C:\\Program Files\\nodejs\\npx.cmd"
args = ["-y", "lanhu-context-mcp"]
[mcp_servers.lanhu-context-mcp.env]
APPDATA = "C:\\Users\\{your-name}\\AppData\\Roaming"
LOCALAPPDATA = "C:\\Users\\{your-name}\\AppData\\Local"
USERPROFILE = "C:\\Users\\{your-name}"
HOME = "C:\\Users\\{your-name}"
SYSTEMROOT = "C:\\Windows"
COMSPEC = "C:\\Windows\\System32\\cmd.exe"Claude Code (.mcp.json) / Cursor (.cursor/mcp.json)
{
"mcpServers": {
"lanhu-context-mcp": {
"command": "cmd",
"args": ["/c", "npx", "-y", "lanhu-context-mcp"]
}
}
}Справочная информация по нативному fallback для Codex:
openai/codex#2555
Шаг 3. Установка расширения Lanhu Helper для Google Chrome
После установки Lanhu Helper вы можете копировать ссылки на выбранные слои или примеры подсказок прямо из Lanhu через контекстное меню.
Шаг 4. Отправка ссылки Lanhu и подсказки ИИ
请根据这个蓝湖设计稿实现
@https://lanhuapp.com/web/#/item/project/detailDetach?tid={tid}&pid={pid}&project_id={project_id}&image_id={image_id}https://lanhuapp.com/web/#/item/project/detailDetach?tid={tid}&pid={pid}&project_id={project_id}&image_id={image_id}Подсказки можно писать в свободной форме, но URL-адрес Lanhu должен быть полным и корректным, иначе вызов инструмента не сработает.
Посмотреть подробную документацию
Экосистема
Lanhu Helper — сопутствующее расширение для браузера Chrome, позволяющее копировать ссылки на слои и примеры подсказок из Lanhu через контекстное меню
Лицензия
Copyright (c) 2026-present, REFINIST
This server cannot be deployed
Maintenance
Related MCP Connectors
UI design from prompts, screenshots, and URLs for AI coding agents and theme tokens.
- miromiroOAuthapp.miromiro
Turn any live website into brand colors, fonts, design tokens, SVGs, Lottie and paste-ready code.
Turns any URL into SEO metadata, contacts, tech stack, and AI-ready Markdown, in one call.
AI-powered design and management for Webflow Sites
Related MCP Servers
- AlicenseAqualityAmaintenanceEnables AI to directly read and analyze Lanhu design drafts and requirement documents to generate HTML, CSS, and structural analyses. It allows users to extract design slices and process prototype pages directly within AI clients.3134 npm131MIT
- AlicenseAqualityBmaintenanceEnables AI coding tools to read Lanhu design data and automate Design to Code, including project browsing, layer tree extraction, DDS semantic components, and code generation.1433 npm3MIT
- AlicenseBqualityBmaintenanceFetches Lanhu UI design specs and assets with minimal tokens, enabling coding agents to implement high-fidelity UI by providing precise coordinates, styles, and downloaded resources.22MIT
- AlicenseAqualityCmaintenanceProvides AI coding agents with structured access to Lanhu design data, enabling direct inspection of artboards, extraction of pixel-perfect layer styles and CSS attributes, and downloading of design assets without vision token overhead.9MIT