[ Content contribution] #MCP探索家# 如何在CodeBuddyIDE中安装FigmaMCP
Tofloor
poster avatar
科技语者
deepin
2025-08-20 14:15
Author

什么是MCP?

小编很早以前发过一篇《深入解析模型上下文协议 (MCP):架构、流程与应用实践》,上面有详细的介绍。

同时也可以参考这篇社区的文章《deepin MCP 服务上线 !首个系统级MCP服务让你解放双手!

CodeBuddyIDE如何安装?

applaud CodeBuddyIDE支持很多大模型(GPT、Gemini、Claude)哦~

第一步:要去官网https://www.codebuddy.ai/上下载IDE并安装。

image.png

第二步:安装完后,务必使用谷歌账号进行登录(貌似QQ邮箱也可以),之后输入邀请 进行激活。

UI界面跟cursor、trae差不多,个人感觉这个UI特别好看

image.png

最让我感觉不错的是:集成比较多,很适合开发者
image.png

如何安装FigmaMCP?

小编整理很久找出来的经验(东拼西凑),查询大量文章总结的《精华文章》

参考文章:Figma MCP + Cursor 完全配置与使用指南:实现设计到代码的智能转换> 通过 Model Context - 掘金 Cursor 接入 Figma MCP | Blog

Figma官网:https://www.figma.com/

注册流程我就跳过了(后续内容为图文结合,因为小编不知道写点啥了,说点大白话😂 )。

image.png

找到:Settings(翻译应该是:设置的意思,本人英语不好

image.png

image.png

image.png

image.png

之后,在完成这个命令(把:你的API KEY,换成自己的)

pnpx figma-developer-mcp --figma-api-key=<你的API KEY>

image.png

按下:Enter(也就是回车),提示下图所示的即为成功

image.png

之后要在这里修改一下配置信息

image.png

image.png

修改完成后记得按下:Ctrl+S保存

如下所示即为成功!
image.png

之后就可以用这个MCP了

详细的调用MCP的”食用“教程可以参考这位博主写的:https://mp.weixin.qq.com/s/MaBBTZdmcoMTgwh62xDWBQ

Reply Favorite View the author
All Replies
大魔王鲸鱼
deepin
2025-08-20 14:20
#1

不明觉厉

Reply View the author