# @cueplusplus/tokens 中文文档

规范地址：https://npmcn.com/package/%40cueplusplus/tokens/

版本：0\.34\.2
npm 元数据更新时间：2026-11-08T17:45:34.517Z
中文译文更新时间：2026-11-11T04:35:51.581Z
软件包许可：MIT

本文由上游 README 翻译，可能存在偏差，请结合原文核对 API、命令与配置。版权与许可归原作者所有。

原始 npm 页面：https://www.npmjs.com/package/%40cueplusplus/tokens
原文对照：https://npmcn.com/package/%40cueplusplus/tokens/?lang=original
项目主页：https://github.com/cueplusplus/cue-ui#readme
源码仓库：https://github.com/cueplusplus/cue-ui

## 关键信息（来自 npm 元数据）

- 包体积（解压后）：652 kB，12 个文件
- 模块格式：ES Module
- TypeScript 类型：包内自带
- Node.js 要求：\>=22
- 运行依赖：0 个
- 首次发布：2026-09-15T22:07:34.424Z
- 最新版本发布：2026-11-08T17:45:34.366Z
- 近 30 天下载量：4232（2026-10-11 至 2026-11-09，npm 官方下载统计）
- 已发布版本数：46（近 12 个月 46 个）

## 中文简介

CUE++设计系统的 DTCG 设计符:5个密度级和8个字体配对,被编译为属性范围CSS自定义属性. 色彩生活在主题包中 .

## 安装

```sh
npm install @cueplusplus/tokens
```

也可以使用：`pnpm add @cueplusplus/tokens`、`yarn add @cueplusplus/tokens`、`bun add @cueplusplus/tokens`

## README

# @ cueplus/ 托盘

下方的符号层 `@cueplusplus/ui`,对于一个需要名词而不是名词的应用程序 通过一个组件: **5个密度图案、14个字体配对、14个样式组和10个油漆 包装**,作为 DTCG 源码编写并编译为属性范围 CSS 自定义属性.

系统5个DOM轴中有4个住在这里,它们拥有严格脱节的符号集——一页是: 每一个都有一个选择,所以他们编成一个总和而不是一个产品:

| 轴 | 拥有 |
| --- | --- |
| `[data-density]` | 几何——控制高度,弧度,间隔,类型大小 |
| `[data-font]` | 三个类型叠叠成对的名称 |
| `[data-style]` | 页面组成——道教和UI领跑,度量,波段节奏,规则和场地,盖子跟踪(13个名字) |
| `[data-paint]` | 尾部 -- -- 相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相接相 |

**颜色不在这里 .** 第五轴, `[data-theme]`,左出此包:调色板是一个包 现在`@cueplusplus/theme-<name>`所以没有 `THEMES` 导出, 没有 `ThemeName`,以及 `dist/theme.css` 是一个已贬值的别名,其名称是: `axes.css` 保持到0.10,以及 之后在未成年人中被带走。 空白的调色板 一个没有被标记的页面 画活在 `@cueplusplus/theme-base`。 。 。 .

## 安装

这个 `@cueplusplus` 范围为 **npm上公开** 并且默认地在那里解决,故无物 用于配置和不提供证书——它像其他任何软件包一样安装.

```sh
pnpm add @cueplusplus/tokens
```

没有对等者和依赖性:此软件包是生成的数据和8行的JavaScript. 这个 也作为依附 `@cueplusplus/ui`,所以一个已经安装组件的应用程序 - 把它命名为 `package.json` 只是使常数可以导入到你自己的代码.

CI、Vercel和信使的过期日期在 [`docs/CONSUMING.md` 第1节](https://github.com/cueplusplus/cue-ui/blob/main/docs/CONSUMING.md#1-registry-access)。 。 。 .

## 快开始

应用程序导入 `@cueplusplus/ui/styles.css` 已有轴作为 CSS; 它需要这个软件包 名称只是为了停止重述它出口的东西.

```ts
import { DENSITIES, token } from "@cueplusplus/tokens";

const ring = `1px solid ${token("focus")}`; // "1px solid var(--cue-focus)"
const labels = DENSITIES.map((rung) => [rung, rung.replace(/-/g, " ")] as const);
```

`DENSITIES` 实值 `["ultra-compact", "compact", "normal", "large", "ultra-large"]`按梯子顺序排列. 从中获取拾取者的标签和样式表的运行列表,而不是写出: 当梯子变了,就静静地去, 没有任何地方报告它。 同样的情况是 其他三个轴线—— `FONTS`, (中文(简体) ), `STYLE_SETS` 财务报告和审定财务报表 `PAINTS` 每个词汇都是按菜单顺序排列的, 和一个从一个人建造的采摘器 与目录一起生长 而不是默默地忽略它的最新条目.

没有捆绑器,CSS中的同一件事是进口:

```css
@import "@cueplusplus/tokens/axes.css";
```

## 飞来飞去

| 子路径 | 这是什么 |
| --- | --- |
| `@cueplusplus/tokens` | 四轴词汇表—— `DENSITIES`, (中文(简体) ), `FONTS`, (中文(简体) ), `STYLE_SETS`, (中文(简体) ), `PAINTS` 与 `MODES` 和每个 `DEFAULT_*`; 每一轴拥有的合同(`COLOR_CONTRACT`, (中文(简体) ), `GEOMETRY_CONTRACT`, (中文(简体) ), `FONT_TOKENS`, (中文(简体) ), `STYLE_CONTRACT`, (中文(简体) ), `STYLE_SET_CONTRACT`, (中文(简体) ), `PAINT_CONTRACT`, (中文(简体) ), `PAINT_INK_CONTRACT`, (中文(简体) ), `PAINT_INKS`(三); `FONT_PAIRINGS` 财务报告和审定财务报表 `FONT_FACES`· ; `faceProperty()` 财务报告和审定财务报表 `token()`; 每个类型 |
| `./axes.css` | 作为 CSS 的密度、字体、样式设置和油漆轴——每个 `[data-density]`, (中文(简体) ), `[data-font]`, (中文(简体) ), `[data-style]` 财务报告和审定财务报表 `[data-paint]` 块——没有颜色 |
| `./tailwind.css` | 尾风 v4 `@theme inline` 绘图层 |
| `./theme.css` | 折旧的别名: `./axes.css`: 保留到0.10, 未成年人在 |
| `./base.json` | 与数据相同的轴, 对于此建筑外建的主题 |
| `./primitives.tokens.json` | 一级调色板主题源别名 |
| `./registry/token-layer.json` | 作为阴影的层中独立主题的一半 _碎片_ ——已折入登记基项,不能自行安装 |

根项是 `dist/tokens.js` 与 `dist/tokens.d.ts` 旁边——平版JavaScript,因为 节点拒绝剥离类型 `node_modules` (单位:千美元) `.ts` 条目为 1 a 注册消费者无法加载.

这里的一切都是由 `build.mjs` 从 `src/**.tokens.json`。编辑源头,绝不 `dist/`。 。 。 .

## 其余的就在这

-   从另一个项目安装和使用: [`docs/CONSUMING.md`](https://github.com/cueplusplus/cue-ui/blob/main/docs/CONSUMING.md)
-   密度梯子, 以及每个跑道上移动的 : [https://ui.cueplus.com/docs/密度](https://ui.cueplusplus.com/docs/density)
-   漆轴,它的十包和每个拒绝的东西: [https://ui.cueplus.com/docs/paint (中文(简体) )](https://ui.cueplusplus.com/docs/paint)
-   这14对, 和10你的应用必须交付: [https://ui.cueplus.com/docs/typefaces (中文(简体) )](https://ui.cueplusplus.com/docs/typefaces)
-   这个 `--cue-*` 以及一个主题如何填充: [https://ui.cueplus.com/docs/theming (英语)](https://ui.cueplusplus.com/docs/theming)
-   您的版本有什么变化 : `node_modules/@cueplusplus/tokens/CHANGELOG.md`

## 常见问题

### @cueplusplus/tokens 是什么？

CUE\+\+设计系统的 DTCG 设计符:5个密度级和8个字体配对,被编译为属性范围CSS自定义属性\. 色彩生活在主题包中 \.

### 如何安装 @cueplusplus/tokens？

在项目目录运行 npm install @cueplusplus/tokens，或使用 pnpm add / yarn add / bun add。

### @cueplusplus/tokens 支持 TypeScript 吗？

支持。包内自带 TypeScript 类型声明（package\.json 声明了 types 入口），安装后即可获得类型提示，无需再安装 @types 包。

### @cueplusplus/tokens 支持 ESM 还是 CommonJS？

以 ES Module 形式发布，推荐使用 import 引入。在 CommonJS 项目中，Node\.js 20\.19\+ / 22\.12\+ 可以直接 require\(\) 不含顶层 await 的 ES Module，更早的版本需要改用动态 import\(\)。

### @cueplusplus/tokens 需要什么版本的 Node\.js？

package\.json 的 engines 字段要求 Node\.js \>=22。版本不符时 npm 默认只给出警告，开启 engine-strict 后会拒绝安装。

### @cueplusplus/tokens 可以商用吗？

@cueplusplus/tokens 使用 MIT 许可。宽松许可：允许商业使用、修改和再分发，通常只需在分发时保留原版权与许可声明。以上为概括，不构成法律意见，请以许可原文为准。

### @cueplusplus/tokens 的下载量有多少？

根据 npm 官方下载统计，@cueplusplus/tokens 在 2026/10/11 – 2026/11/09 这 30 天内被下载 4,232 次，日均约 141 次。下载量会把 CI 构建、镜像同步和作为其他包依赖的安装一并计入，适合横向比较热度，不能直接等同于使用人数。

### @cueplusplus/tokens 还在维护吗？

最新版本 0\.34\.2 发布于 2026/11/09（2 天前）；至今共发布 46 个版本，其中过去 12 个月发布了 46 个；首次发布于 2026/09/16。发布频率只是参考信号：功能稳定的工具可能很少需要更新，建议结合源码仓库的 issue 和提交记录判断。