mcpField
L
library-variables-figma

library-variables-figma

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

关于 library-variables-figma

用于浏览并导入当前 Figma 文件所订阅团队库变量的技能。导入后变量获得本地 ID,可像本地变量一样绑定或引用。

主要功能

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

适用场景

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

MCP 相关

此技能通过 `use_figma` 执行 Figma Plugin API 脚本;输入未说明其作为 MCP 服务或客户端。

安装

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

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

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

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

详细介绍

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

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

技能范围

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

工作流

  1. 发现。 通过 use_figma(skillNames: "library-variables-figma")运行 scripts/list-library-variables.js。可选设置 LIBRARY_NAME / COLLECTION_NAME / TYPE 过滤条件。此脚本会返回每个已订阅的集合及其中每个变量的 key。
  2. 导入。 将变量 key 放入 scripts/import-library-variable.js 并运行。脚本会为每个变量返回新的 localId。重复导入具有幂等性(返回相同的本地 ID)。
  3. 使用。 将导入的变量绑定到节点属性,或从本地语义令牌中引用(有关绑定,请参阅 figma-use / manage-variables-figma)。

说明

  • 这里只会显示已订阅的库。如果缺少某个集合,请先在文件的库设置中启用相应库(这是一个需要在 Figma 中手动执行的步骤)。
  • getVariablesInLibraryCollectionAsync 接收的是集合 key,而不是集合 ID。
  • 库变量是指向源变量的只读引用——请在库文件中编辑值,而不是在此处编辑。

评论

支持 Markdown