1.0.0 • Published yesterday

@elder-ui/tokens

Licence

—

Version

1.0.0

Deps

Size

58 kB

Vulns

Weekly

Elder UI 的 Primitive 与 Semantic design tokens 单一数据源。源码使用 DTCG 风格的 $value、$type 和引用语法；不在 Web 与微信端分别维护变量。

pnpm --filter @elder-ui/tokens build
pnpm --filter @elder-ui/tokens check
pnpm --filter @elder-ui/tokens check:reference-failure

check 会从删除后的 dist 重建两次并比较 SHA-256，检查 Web/微信语义变量集合和平台尺寸 transform，故意构造缺失引用并确认构建失败，最后恢复规范产物。

dist/web/tokens.css
dist/wechat/tokens.wxss
dist/js/tokens.js
dist/types/tokens.d.ts
dist/json/tokens.json

dist 是生成目录，禁止手工修改。Web 尺寸保持 px；微信普通布局尺寸按 375px 画布转换为两倍 rpx，字体和发丝线使用显式例外保留 px。

本次配色、字体、间距和视觉尺寸采用全新的语义命名，不保留旧变量别名。主要替换关系如下：

旧变量	新变量
`--semantic-color-background-page`	`--semantic-color-bg`
`--semantic-color-background-surface`	`--semantic-color-surface`
`--semantic-color-text-primary`	`--semantic-color-text`
`--semantic-color-action-primary`	`--semantic-color-primary`
`--semantic-color-feedback-danger`	`--semantic-color-danger`
`--semantic-layout-space-default`	`--semantic-layout-space-lg`
`--semantic-layout-space-compact`	`--semantic-layout-space-sm`
`--semantic-layout-radius-control`	`--semantic-layout-radius-medium`
`--semantic-layout-control-minimum-size`	`--semantic-layout-control-height-default`
`--semantic-typography-title-*`	`--semantic-typography-section-title-*`

迁移时应直接替换消费方变量，并根据控件用途在 compact/default/large/elder 中选择高度。若需要回退，应整体固定到上一版 @elder-ui/tokens、@elder-ui/vue 与 @elder-ui/wechat，不要混用新旧版本。