mcpField
F
figma-library-variables

figma-library-variables

github.com/southleft设计与 UI94123 次安装10 周前更新
代码仓库

关于 figma-library-variables

figma-library-variables 是用于发现并导入当前 Figma 文件所订阅团队库变量的技能。它保留源变量的引用属性,并提供可在本地绑定或引用的 ID。

主要功能

  1. 01列出已订阅库的变量
  2. 02按库、集合和类型筛选
  3. 03导入变量并返回本地 ID
  4. 04重复导入保持幂等

适用场景

  1. 01查找团队库中的设计变量
  2. 02将库变量导入当前文件
  3. 03把导入变量绑定到节点属性

安装

复制下面的命令,在终端中运行。

$npx skills add https://github.com/southleft/figma-console-mcp-skills --skill figma-library-variables

安装后在 Claude Code 中输入/figma-library-variables确认已加载。

附带文件scripts/import-library-variable.jsscripts/list-library-variables.js

详细介绍

figma-library-variables — 发现并导入团队库变量

浏览当前文件已订阅的库所发布的变量,然后导入所需变量。导入的变量会获得一个本地 ID,其行为与任何本地变量相同(绑定、读取和引用)。

技能边界

  • use_figma 规则 — 首先加载官方 figma-use 技能;它是完整的 Figma Plugin API 参考。这些脚本依赖的要点:使用纯 JS,并在顶层使用 await 和 return(不要使用 IIFE 或 figma.closePlugin();console.log 不会作为返回值返回),在每个脚本顶部以内联方式声明输入常量,颜色范围为 0–1,在任何文本操作前加载字体,使用 await figma.getNodeByIdAsync(...),并采用原子错误处理(脚本失败时不会应用任何更改 — 读取错误、修复后重试)。
  • 本地(非库)变量 → figma-export-tokens、figma-manage-variables。

工作流

  1. 发现。 通过 use_figma(skillNames: "figma-library-variables")运行 scripts/list-library-variables.js。可选设置 LIBRARY_NAME / COLLECTION_NAME / TYPE 筛选条件。该脚本会返回每个已订阅的集合及其中每个变量的 key。
  2. 导入。 将变量 key 放入 scripts/import-library-variable.js,然后运行。该脚本会返回每个变量的新 localId。重复导入不会产生额外效果(返回相同的 local id)。
  3. 使用。 将导入的变量绑定到节点属性,或在本地语义令牌中引用(绑定方式请参阅 figma-use / figma-manage-variables)。

备注

  • 只会显示已订阅的库。如果缺少某个集合,请先在文件的库设置中启用该库(需在 Figma 中手动操作)。
  • getVariablesInLibraryCollectionAsync 接收的是集合 key,而不是其 ID。
  • 库变量是对源变量的只读引用 — 请在库文件中编辑值,而不是在此处编辑。

评论

支持 Markdown