Figma MCP链路抓取器
获取 所有Figma MCP链路 从每一页和每一层：按 Page → 截面（框架/组）→ 层这些链接与Figma MCP工具配合使用(get_design_context, get_metadata等），因此您可以为每个帧和层“从Figma实现此设计”。
你得到了什么
- 嵌套结构：页数→ 章节（顶级框架/组）→ 所有子层
- MCP就绪URL:
https://www.figma.com/design/{fileKey}/{fileName}?node-id={id}对于每个节点 - 脚本 （节点）和 Chrome 扩展 从CLI或Figma选项卡运行
1.节点脚本
使用 Figma REST API 获取文件并打印所有MCP链接。
设置
- 拿一个 Figma个人访问令牌：Figma→ 设置→ 账户→ 个人访问令牌 → 生成。
- 运行时设置：
export FIGMA_ACCESS_TOKEN=figd_xxxxxxxx用法
从Figma设计URL（例如您的Biovue文件）：
FIGMA_ACCESS_TOKEN=figd_xxx node script/grab-mcp-links.js --url "https://www.figma.com/design/yyrjA3N8nssLRxPNRl1e2N/Biovue?node-id=1089-1167&m=dev"从文件密钥（和可选文件名）：
FIGMA_ACCESS_TOKEN=figd_xxx node script/grab-mcp-links.js yyrjA3N8nssLRxPNRl1e2N Biovue仅限平面列表（每行一个链接）：
FIGMA_ACCESS_TOKEN=figd_xxx node script/grab-mcp-links.js --url "https://www.figma.com/design/..." --flat输出
- 嵌套（默认）:
## Page: …→### Section: …→- layer (type)每个下面都有链接。 - 平坦的：每条线路一个MCP链路。
______________________________________________________________________
2.Chrome扩展程序
弹出窗口中的逻辑相同：使用当前的Figma选项卡或粘贴URL，抓取所有MCP链接，然后 选择页面 在复制或导出之前包含。
安装
- 打开Chrome浏览器→
chrome://extensions - 打开 开发人员模式
- 装载时未包装 → 选择
extension此仓库的文件夹
先用
- 点击 “设置令牌” （或“Figma个人访问令牌→” 链接）。
- 粘贴你的Figma 个人访问令牌 并保存。
用法
- 打开Figma设计文件（例如。
https://www.figma.com/design/.../Biovue?...). - 单击扩展图标。
- 从当前选项卡 或粘贴Figma设计URL→ 抓取MCP链接.
- 在 选择页面，选中或取消选中页面。使用 全部 / 无 选择或清除全部。摘要显示了选择了多少页面和链接。
- 复制链接 或 出口 （CSV、JSON、PDF）。仅包括所选页面的链接。
选择页面
抓取后，会出现一个页面列表，其中包含复选框和每页的链接数。你可以：
- 全部 –选择每一页
- 无 –明确选择
- 打开或关闭单个页面
复制和导出仅使用 选中的 页。当您更改选择时，行“Y页中的X页·已选择N个链接”会更新。
导出（CSV、JSON、PDF）
从 复制和导出 面积：
- CSV –带列的电子表格：页面、节、图层名称、类型、链接（每个节点一行）。UTF-8编码，带Excel BOM表。仅选定页面。
- JSON –结构化文件：
fileName,exportedAt,pages（嵌套sections和layers)，以及allLinks。仅选定页面。 - PDF –打开打印友好选项卡。单击 “打印/另存为PDF” 在打印对话框中选择“另存为PDF”。仅选定页面。
______________________________________________________________________
这与Figma MCP如何匹配
这 Figma MCP服务器 （例如在Cursor中）暴露了以下工具 get_design_context 和 get_metadata 这需要一个 Figma节点URL （或 fileKey + nodeId).该项目不会改变Figma MCP服务器本身；它 扩展您的工作流程 通过：
- 列表 每个相关节点（页面、部分、框架、层）作为MCP就绪链接。
- 允许您将这些链接粘贴到提示中或与
get_design_context/get_metadata因此，代理可以为每个帧或层“从Figma实现此设计”。
因此，您可以在一个地方获得“所有帧/页面的所有MCP链接”，然后将其与现有的Figma MCP工具一起使用。
______________________________________________________________________
MCP链路格式
每个链接都有以下形式：
https://www.figma.com/design/{fileKey}/{fileName}?node-id={nodeId}fileKey：来自Figma URL（例如。yyrjA3N8nssLRxPNRl1e2N).fileName：URL中的文件名（例如。Biovue).nodeId：节点id为:被替换为-（例如。1089-1167对于节点1089:1167).
这些URL与Figma在开发模式下用于“复制链接”的URL以及Figma MCP所期望的URL相同。
______________________________________________________________________
项目布局
├── script/
│ └── grab-mcp-links.js # Node script
├── extension/
│ ├── manifest.json
│ ├── popup.html / popup.js
│ ├── options.html / options.js
│ ├── export.html / export.js # print view for PDF export
│ └── (optional: icons/icon16.png, icon48.png)
├── package.json
└── README.md可选：添加 extension/icons/icon16.png 和 extension/icons/icon48.png，然后设置 "icons": { "16": "icons/icon16.png", "48": "icons/icon48.png" } 在 manifest.json 如果你想要一个自定义扩展图标。