用途:该技能用于校验设计与代码是否一致。它读取 Figma 节点的真实规格,与 codeSpec(组件实际渲染的值)做差异比对,返回加权一致性评分、逐属性差异(含严重级别)和修复建议。它是代码生成的逆过程:get_design_context 把设计转成代码,本技能确认代码没有偏离设计。所有设计读取都通过 use_figma 完成,因此适用于任何 Figma 方案。
主要能力:提取节点的填充、描边、圆角、不透明度、内边距/间距和文本属性,并与 codeSpec 比对。评分公式为 summary.parityScore = max(0, 100 − (critical×15 + major×8 + minor×3 + info×1))。discrepancies[] 列出每处不匹配的 category、property、severity、designValue、codeValue 与 suggestion。颜色在 Figma 中为 0–1 范围,脚本会转成十六进制并归一化后再比较;尺寸比较带小容差(宽高约 2px,不透明度 0.01),避免亚像素舍入被误判为漂移。只比较 codeSpec 中已填写的部分,省略某段即跳过,不会产生误报。严重级别影响评分:颜色/间距为 major(−8),圆角/边框宽度/不透明度为 minor(−3)。
使用方式:先组装 codeSpec,把组件渲染的值填入对象(完整结构见 references/parity-scoring.md),只需填写想比较的部分:visual、spacing、typography、accessibility。提示:figma-scan-code-accessibility --map-to-codespec 可自动生成 codeSpec.accessibility。然后设置 NODE_ID,把 codeSpec 粘贴进 scripts/check-parity.js,通过 use_figma(skillNames: "figma-check-design-parity")运行。读取评分卡后决定修哪一侧:改代码匹配设计,或通过 figma-manage-variables / figma-use 把设计改成有意为之的代码变更,再重跑确认分数上升。
限制与边界:使用前应先加载官方 figma-use 技能,它是完整的 Figma Plugin API 参考。脚本依赖的要点包括:纯 JS 加顶层 await 与 return(不用 IIFE,不调用 figma.closePlugin(),console.log 不会被返回),输入以 const 内联在脚本顶部,颜色为 0–1 范围,任何文本操作前先加载字体,使用 await figma.getNodeByIdAsync(...),错误是原子性的(脚本失败则不应用任何改动,读错误、修复、重试)。从设计生成代码请用原生 get_design_context,本技能只做校验不生成;代码侧无障碍信息请用 figma-scan-code-accessibility;设计侧 WCAG 检查请用 figma-lint-design。