使用cursor-talk-to-figma-mcp实现cursor连接Figma
一、准备工作
Figma桌面版、cursor桌面版、github账号
二、下载MCP
我用的是cursor-talk-to-figma-mcp,在github上面直接搜索,链接:cursor-talk-to-figma-mcp。然后点击code,下载压缩包,然后解压缩


三、安装包子
1.正常步骤
在下载的压缩包对应的文件夹下打开终端,在cursor或者PowerShell打开都可以。
注意一定要是这个MCP文件的对应根目录(在终端里使用cd命令进入根目录),要不就会在bun setup这一步一直报错找不到setup文件。
cd 下载的压缩包对应文件夹的地址
接下来就是按照github上给出的步骤一步一步安装,在终端中依次输入以下命令:
2.可能遇到的问题
(1)Invoke-WebRequest
终端指令:curl -fsSL https://bun.sh/install
具体报错:Invoke-WebRequest : 找不到与参数名称“fsSL”匹配的参数。 所在位置 行:1 字符: 6 + curl -fsSL https://bun.sh/install | bash + ~~~~~ + CategoryInfo : InvalidArgument: (:) [Invoke-W ebRequest],ParameterBindingException + FullyQualifiedErrorId : NamedParameterNotFound,Microso ft.PowerShell.Commands.InvokeWebRequestCommand在 原因:curl是Linux的一个指令,在Windows系统中,PowerShell 里,curl其实是 Invoke-WebRequest 的一个别名。它并不认识 -fsSL 这些在标准 curl 里才有的参数,所以才会报错。
解决方法:我搜了一下,也问了一下AI,很多博主说把curl改成curl.exe,但是其实还是会出现报错(报错显示:适用于 Linux 的 Windows 子系统没有已安装的分发。 可通过安装包含以下说明的分发来解决此问题: 使用“wsl.exe --list --online' ”列出可用的分发 和 “wsl.exe --install <Distro>” 进行安装)。
最后发现只是不同系统的命令格式不一样的问题,把命令改成下面的就可以正常运行了,记得开代理,否则这一步可能会出现因为网络问题请求超时的问题。
irm bun.sh/install.ps1 | iex
(2)bun setup报错
具体报错:bun: command not found: ./scripts/setup.sh error: script "setup" exited with code 1
看了下载的文件夹之后看到是有setup.sh文件的,问了AI之后换成了bun install的命令,正常运行成功了,可能是版本更新的问题。
四、在cursor中配置MCP
按照下面的步骤在cursor中进行配置

点击新建MCP Server后,将下载的cursor-talk-to-figma-mcp文件中的mcp.json文件中内容复制到这里。

五、Figma连接
在插件商场里搜索Talk To Figma ,点击connect,如果显示绿色,并且channel号和cursor的一样,就是正常连接。


六、对话
在对话框中可以要求检查是否成功连接figma,然后就可以在cursor中给出命令,cursor就会自动在figma中给出设计原型了,连接成功后就无需开代理了。如果在这一步显示请求超时,可以重启cursor试一下,可能是免费用户channel不稳定之类的问题。
使用体验来说,感觉在Figma设计缺少一些交互,基本的UI界面可能也没有cursor本身设计的强,不过这可能和我使用的是cursor自带的Auto模型也有关。
七、结语
如果是免费版的,大家一定要节省用,最好把提示词先喂给别的AI一次,修改好了再给cursor,我的免费额度大概用了3个前端设计和2次连接Figma就没有了。
我也是第一次尝试AI工具和Figma的连接,可能有些地方不准确,欢迎大家纠正。操作思路也是参考B站up主的这个视频来实现连接的,大家有需要也可以看视频进行操作。

更多推荐
所有评论(0)