flyu

Cliente local de archivos de diseño: analiza archivos de diseño de Sketch / Figma en un DSL v3 unificado, expuesto a Cursor / Claude a través de un MCP integrado (HTTP, que se inicia con la app), para que la IA pueda ver directamente los diseños, escribir código, modificar archivos y exportar recursos.

Demostración

https://github.com/user-attachments/assets/51cc93c6-8413-4c3b-8bfd-7fd135e26a3c

Licencia: MIT. Declaraciones de terceros en NOTICE.md. Divulgación de seguridad en SECURITY.md. Contribuciones en CONTRIBUTING.md.

Los formatos de archivo y las marcas comerciales de Sketch / Figma pertenecen a sus respectivos titulares. Este proyecto analiza los archivos .sketch / .fig que importes en tu máquina local, sin incluir licencias de los fabricantes ni afirmar ninguna afiliación con Figma, Inc. o Sketch B.V. Respeta sus términos de servicio e importa únicamente archivos de diseño que tengas derecho a usar. La implementación de decodificación de .fig se encuentra en crates/fig-kiwi-rs.

La documentación para usuarios se encuentra en docs/user-guide.md (instalación / funciones / frases de ejemplo / solución de problemas); los detalles de las herramientas MCP están en docs/write-tools-guide.md.

Related MCP server: figma-opencode-mcp

Desarrollo

pnpm install        # 安装依赖(postinstall 会把 better-sqlite3 编到 Electron ABI)
pnpm dev            # 启动 Electron + HMR
pnpm typecheck      # 类型检查(main + renderer + mcp + tests)
pnpm lint           # ESLint
pnpm test           # 单元 + 契约测试(tsx --test)
pnpm test:visual    # 渲染像素回归(改 import/render 后必跑)
pnpm build          # 构建到 out/(含 main/preload/renderer/mcp)
pnpm dist           # 打本机未签名 mac 双架构(arm64 + x64).dmg → release/

Empaquetado (sin firmar en macOS local)

pnpm dist           # build + electron-builder → release/flyu-*-mac-arm64.dmg + flyu-*-mac-x64.dmg
pnpm dist:dir       # 只打 arm64 .app 到 release/mac-arm64/(便于调试)

Doble arquitectura: electron-builder empaqueta por separado según la arquitectura de destino; better-sqlite3 se recompila para cada arquitectura (la compilación cruzada de x64 en un host arm64 está verificada y funciona).

El resultado es un paquete sin firmar (identity: null); tras la instalación, el nombre de la aplicación es «非鱼». Si Gatekeeper bloquea la apertura local: clic derecho → Abrir. No lo inicies a la vez que pnpm dev esté en ejecución (el bloqueo de instancia única hará que el segundo proceso salga inmediatamente).

MCP Server

Dos formas de conexión, con el mismo conjunto de tools/prompts (29 Tools + 4 Prompts):

• HTTP (recomendado): el cliente integra Streamable HTTP, que se inicia con la app. Configuración → Configuración de uso de MCP → Copiar (URL + Bearer token). El puerto por defecto es 32677 y se persiste; solo se desplaza si está ocupado. El token se persiste en userData/mcp-token (0600) y se puede regenerar.

• stdio (alternativa, requiere Node local): node out/mcp/server.js. Requiere que la base de datos ya exista (el cliente debe haberse ejecutado al menos una vez).

Construcción de la entrada stdio

pnpm mcp:build      # esbuild 打包到 out/mcp/server.js
pnpm mcp:dev        # tsx 直跑(调试用)

Verificación (prueba manual con JSON-RPC)

echo '{"jsonrpc":"2.0","id":1,"method":"initialize","params":{"protocolVersion":"2024-11-05","capabilities":{},"clientInfo":{"name":"test","version":"1.0"}}}' | pnpm mcp:dev

Debe devolver serverInfo: { name: "flyu-design", version: "1.0.0" }.

Trampas del desarrollo local en macOS (doble ABI + firma de código)

1. Cambio de ABI: better-sqlite3 solo puede compilarse para un runtime a la vez.

   • Para Electron: pnpm rebuild (usa electron-rebuild)

   • Para ejecutar Node directamente (depuración de MCP / pruebas con tsx): cd node_modules/.pnpm/better-sqlite3@*/node_modules/better-sqlite3 && ./node_modules/.bin/prebuild-install -r node

   • Síntoma: si se compila para el runtime equivocado, aparece un error como NODE_MODULE_VERSION 130 vs 127.

2. Firma de código: el .node precompilado descargado de npm es eliminado por AMFI en macOS 26+ con Invalid Page (SIGKILL, exit 137, stderr vacío). Solución:

   codesign --remove-signature node_modules/.pnpm/better-sqlite3@*/node_modules/better-sqlite3/build/Release/better_sqlite3.node
   codesign --force --sign -       node_modules/.pnpm/better-sqlite3@*/node_modules/better-sqlite3/build/Release/better_sqlite3.node

   Hay que repetirlo después de cada prebuild-install. Para empaquetados posteriores, se automatiza con el hook afterSign de electron-builder.

Estructura de directorios

src/
├── main/           Electron 主进程(DB / IPC / 渲染 / 导入导出)
│   ├── import/     双通道导入:sketch-*(.sketch)/ fig-*(.fig 本地,@open-pencil/core)
│   │               + html-to-dsl(HTML 生成)、collect-tokens(共享令牌统计)
│   ├── render/     渲染调度(fig 走 Skia 直渲;sketch 走 DSL→HTML→Chromium)
│   ├── export/     dsl-to-jsx / dsl-to-fig / vector-to-svg / code-snippets / cut-cache
│   ├── tokens/     设计令牌(L1 命名令牌 / L3 组件令牌 / tokenize)
│   ├── db/         SQLite(writers / write-ops / write-docs / restyle / migrations)
│   └── ipc/        渲染进程桥(files / folders / explorer / mcp-config / library)
├── preload/        contextBridge 桥
├── renderer/       React + AntD UI
├── mcp/            MCP Server:server.ts(stdio)+ tools.ts(聚合器)+ tools-*.ts(8 个域模块)
├── shared/         三端共享(DSL v3 类型 / IPC 通道 / 错误码 / 路径)
└── native/         fig-kiwi WASM(由 crates/ 编译)

crates/             Rust 原生(.fig Kiwi 解码)
resources/          打包图标 icon.png / icon.icns
docs/               用户教程 / 写能力设计与工具文档
scripts/            正式脚本(icons / wasm / 视觉回归)
tests/              单元与契约测试

Los datos de ejecución locales se encuentran en el directorio de usuario (~/Library/Application Support/flyu) y en el opcional .tokensave/ (ignorado por git); los artefactos de compilación están en out/.

Estado actual

• Importación por dos canales: .sketch / .fig local (@open-pencil/core)

• DSL v3 unificado + persistencia en SQLite + grupos de versiones

• Renderizado: fig con renderizado directo de Skia; sketch/ai DSL→HTML→Chromium; reporte explícito de degraded

• MCP con 29 Tools + 4 Prompts (navegación / datos / visual / código / exportación de recursos / operaciones de escritura / modificación semántica)

• Capacidades de escritura: apply_operations transaccional / restyle_* (dryRun) / create_from_html / fork_document / rollback

• Exportación: get_html (archivo único autocontenido) / get_code (JSX+Tailwind, vw/rem/tokenize) / export_fig (interoperabilidad no oficial de .fig) / download_assets (SVG/PNG/imagen original)

• Design tokens: tokens con nombre L1 (variables de fig / estilos de sketch, exportación css/dtcg) + revisión de cobertura de tokens de componentes L3

• Paquetes de instalación para Windows / Linux (configuración existente, sin publicar)