【亲测免费】 Cursor Talk To Figma MCP 使用教程

1. 项目的目录结构及介绍

Cursor Talk To Figma MCP 项目是一个开源项目，它实现了Cursor AI和Figma之间的模型上下文协议（MCP）集成。以下是项目的目录结构及其介绍：

cursor-talk-to-figma-mcp/
├── images/                      # 存放项目相关图片
├── scripts/                     # 存放JavaScript脚本文件
├── src/                         # 源代码目录
│   ├── talk_to_figma_mcp/       # TypeScript MCP服务器，用于Figma集成
│   ├── cursor_mcp_plugin/       # Figma插件，用于与Cursor通信
│   ├── socket.ts                # WebSocket服务器，用于MCP服务器与Figma插件之间的通信
├── .gitignore                   # 指定Git忽略的文件和目录
├── Dockerfile                   # Docker配置文件
├── LICENSE                      # 项目许可证文件
├── bun.lock                     # bun包管理器的锁定文件
├── package.json                 # Node.js项目配置文件
├── readme.md                    # 项目自述文件
└── tsconfig.json                # TypeScript配置文件

2. 项目的启动文件介绍

项目的启动主要涉及到几个关键脚本：

• bun setup: 这个命令用于设置项目环境，并安装必要的依赖。
• bun socket: 启动WebSocket服务器，它是Cursor AI和Figma插件之间的通信桥梁。
• bunx cursor-talk-to-figma-mcp: 启动MCP服务器，它是Figma集成的核心。

在项目的根目录下，通过命令行执行上述命令，可以启动整个项目。

3. 项目的配置文件介绍

项目的主要配置文件是 ~/.cursor/mcp.json，它用于配置Cursor AI的MCP服务器。以下是一个配置示例：

{
  "mcpServers": {
    "TalkToFigma": {
      "command": "bunx",
      "args": ["cursor-talk-to-figma-mcp"]
    }
  }
}

在这个配置文件中，你需要指定一个MCP服务器，这里名为 "TalkToFigma"。command 字段指定了启动MCP服务器的命令，而 args 字段则指定了该命令的参数。

此外，WebSocket服务器在 src/socket.ts 中配置。如果需要在Windows WSL环境下运行，需要取消注释该文件中的 hostname 配置：

// uncomment this to allow connections in windows wsl
hostname: "0.0.0.0",

以上是Cursor Talk To Figma MCP项目的启动和配置文件的基本介绍。按照这些步骤操作，可以顺利地启动并运行该项目。