Cursor Talk to Figma MCP
作者：@sonnylazuardi
原文：
https://github.com/sonnylazuardi/cursor-talk-to-figma-mcp
该项目旨在通过实现模型上下文协议 (Model Context Protocol, MCP)，在 Cursor AI (一个 AI 驱动的代码编辑器) 和 Figma (一个基于浏览器的协作设计工具) 之间建立通讯桥樑。这使得 Cursor 能够读取 Figma 设计并以程序化的方式对其进行修改。
模型上下文协议 (MCP) 集成： 该项目的核心是利用 MCP 实现 Cursor 和 Figma 之间的双向通信。
正如项目描述所言：
"This project implements a Model Context Protocol (MCP) integration between Cursor AI and Figma, allowing Cursor to communicate with Figma for reading designs and modifying them programmatically."
这意味著 Cursor 可以理解 Figma 设计的结构和属性，并能根据用户的指令进行操作。
项目结构
该项目包含以下主要组成部分：
-
src/talk_to_figma_mcp/
包含 Figma 集成的 TypeScript MCP 服务器。这个服务器负责处理来自 Cursor 的请求并与 Figma 进行交互。
-
src/cursor_mcp_plugin/
包含 Figma 插件，该插件用于与 MCP 服务器进行通信。这个插件是 Figma 中用户启动和连接到 Cursor 的界面。
-
src/socket.ts
一个 WebSocket 服务器，用于在 MCP 服务器和 Figma 插件之间建立实时通信通道。
安装和设置
详细的安装和设置步骤：
-
MCP 服务器 (Cursor 端)： 需要安装 Bun (一个 JavaScript 运行时)，然后将服务器配置添加到 Cursor 的 MCP 设置文件 (
~/.cursor/mcp.json
) 中。配置中指定了用于启动服务器的命令和参数，例如：
{
"mcpServers": {
"TalkToFigma": {
"command": "bun",
"args": [
"/path/to/cursor-talk-to-figma-mcp/src/talk_to_figma_mcp/server.ts"
]
}
}
}
-
WebSocket 服务器： 需要单独运行
src/socket.ts
来启动 WebSocket 服务器。
bun run src/socket.ts
-
Figma 插件： 需要在 Figma 中通过 “Plugins> Development > New Plugin > Link existing plugin” 链接
src/cursor_mcp_plugin/manifest.json
文件来安装。
使用流程
使用此集成的一般流程包括：
