令牌先于一切
颜色、间距、字号先定成命名令牌,后面所有东西都引用它,改主题才不用改组件。
变量承载语义,组件承载结构
变量解决「深色模式下这里变什么」,组件解决「这里长什么样」。混在一起就没法批量改。

文档写在组件旁边
把用法、禁用场景写进组件描述,比单独建一个文档站更容易被读到。
版本化与废弃机制
没有废弃标记的组件库,两年后没人敢删任何东西。

文中提到的工具
本文基于真实团队落地过程整理,工具版本以发布时为准;若发现描述与当前版本有出入,欢迎在站内反馈。
先做组件库再补变量,是绝大多数团队返工的起点。正确顺序是令牌 → 变量 → 组件 → 文档。
颜色、间距、字号先定成命名令牌,后面所有东西都引用它,改主题才不用改组件。
变量解决「深色模式下这里变什么」,组件解决「这里长什么样」。混在一起就没法批量改。

把用法、禁用场景写进组件描述,比单独建一个文档站更容易被读到。
没有废弃标记的组件库,两年后没人敢删任何东西。

本文基于真实团队落地过程整理,工具版本以发布时为准;若发现描述与当前版本有出入,欢迎在站内反馈。