@ design- parity/ 适应器- stitch

谷歌时尚 ReferenceAdapter斯地奇船队 @google/stitch-sdk + 一个 MCP 服务器但已 无代码连接等效和菲格玛的机器链接不同 信件通过 repo 解决 design-map.json。参考文献是 总是用 linkMethod: "manifest"。 。 。 .

它会做什么

resolve(componentId, ref, ctx)数字 :

1. 解开手柄. 一个直接 stitch:<projectId>/<screenId> 参考解析 现为. 否则适配器负载 design-map.json (单位:千美元)designMapPath,或 DESIGN_MAP_FILE,则 <repoRoot>/design-map.json和 findByCode 地图 其Stitch ref的组件——清单是唯一的通信层.
2. 获取 HTML+ 尾风 通过Sitch SDK(一个或多个屏幕变体).
3. 稀释 每个屏幕无头地显示一个参考PNG;尺寸读取 直接从PNG IHDR中跳出,所以不能从diff引擎的字节漂移 比较起来.
4. 提取从 Tailwind 衍生出的迹象 - 距离/辐射/背景 颜色 + 从标题和正文中打入 DesignTokens。 。 。 .
5. 规范化 改为 DesignReference 与 linkMethod: "manifest"。 。 。 .

认证

默认 SDK 客户端从 AdapterContext.env,顺序为: STITCH_API_KEY, (中文(简体) ), STITCH_TOKEN, (中文(简体) ), STITCH_ACCESS_TOKEN, (中文(简体) ), GOOGLE_STITCH_TOKEN。 。 。 .

遗失的证书 StitchAuthError;一个被否决的,是从 SDK(英语:SDK). 无匹配的组件 design-map.json 增加条目数 StitchManifestError; 无法解析的 ref 提出 StitchBadRefError。 。 。 .

使用量

import { createStitchAdapter } from "@design-parity/adapter-stitch";

const adapter = createStitchAdapter();

const reference = await adapter.resolve(
  "ui/Card.kt#OfferCard",
  "stitch:design/abc123", // or the code handle, resolved via design-map.json
  { repoRoot: process.cwd(), env: process.env },
);

可注射接缝

SDK和发光器都是接口,所以单位测试与 没有生命 来源和无浏览器 (见 test/:

• StitchClient.fetchDesign(ref) → StitchDesign (单位:千美元){ screens }) (中文(简体) ). 默认 createSdkStitchClient 懒散驱动器 @google/stitch-sdk,远离 软件包的硬依赖性, 所以安装要保持干净; 缺失是明确的 StitchSdkError。 。 。 .
• Rasterizer.rasterize({ html, css }) ^ PNG 字节. 默认 browserRasterizer 驱动在其中发现的无头铬/铬 PATH (或 CHROME_PATH)——从来不是捆绑的浏览器自定义依赖,反射 候选制作人.