# @bcc-code/design-tokens 中文文档

规范地址：https://npmcn.com/package/%40bcc-code/design-tokens/

版本：5\.2\.13
npm 元数据更新时间：2026-10-26T07:58:12.462Z
中文译文更新时间：2026-11-07T23:09:53.263Z
软件包许可：MIT

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

原始 npm 页面：https://www.npmjs.com/package/%40bcc-code/design-tokens
原文对照：https://npmcn.com/package/%40bcc-code/design-tokens/?lang=original
源码仓库：https://github.com/bcc-code/bcc-tokens

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

- 包体积（解压后）：295 kB，8 个文件
- 模块格式：ES Module
- TypeScript 类型：包内自带
- Node.js 要求：\>=18\.0\.0
- 运行依赖：0 个
- peer 依赖：@primeuix/themes ^2\.0\.0
- 首次发布：2023-03-07T12:22:19.330Z
- 最新版本发布：2026-10-26T07:58:12.252Z
- 近 30 天下载量：2079（2026-10-08 至 2026-11-06，npm 官方下载统计）
- 已发布版本数：202（近 12 个月 118 个）

## 中文简介

设计符号构建系统

## 安装

```sh
npm install @bcc-code/design-tokens
```

也可以使用：`pnpm add @bcc-code/design-tokens`、`yarn add @bcc-code/design-tokens`、`bun add @bcc-code/design-tokens`

## README

# @bcc-code/deign-tokens (英语)

BCC设计系统的设计标志. 为 CSS 、 Tailwind v4 和 PrimeVue 提供颜色、打字、间隔和组件主题,并有光/暗模式支持.

## 安装

```bash
npm install @bcc-code/design-tokens
```

## 文档

关于使用说明、组成部分准则和实例,见文件全文:

**[开发者.bcc.no/bcc设计](https://developer.bcc.no/bcc-design/)**

## 快速链接

-   [开始](https://developer.bcc.no/bcc-design/getting-started/) - 安装和设置
-   [基金会](https://developer.bcc.no/bcc-design/foundations/) - 指针、颜色、印刷、间隔
-   [构成部分](https://developer.bcc.no/bcc-design/components/) - PrimeVue 组件样式

## 添加组件键

当设计者通过 Figma 添加或更新 PrimeVue 组件符号时:

1.  **从图像导出** - 组成部分标志土地 `tokens/aura/component.json`
2.  **添加主题覆盖( 建议)** - 对于轻/暗区分,在两者中增加部分 `tokens/aura/component/light.json` 财务报告和审定财务报表 `tokens/aura/component/dark.json`。没有这些内容,该部分将在两个主题中使用相同的符号.
3.  **运行构建** —— 说 `pnpm build`
4.  **检查警告** ——该构件会警告组件缺少主题覆盖

组件符号自动取自 `component.json` ——无手动清单保存.

对于特定BCC的布局/大小覆盖(不是来自Figma),将其添加到 `MANUAL_COMPONENT_OVERRIDES` 内 `export-tokens/constants.js`。 。 。 .

## 仓库结构

### 生成的文件夹

-   `tokens/` 由 Figma 符号导出( 设计中的真理来源).
-   `build/` 是通过运行构建脚本生成的(`pnpm build` 编号 : `node export-tokens/build.js`) (中文(简体) ).
-   不要手动编辑文件 `build/`;转而再生.

### `export-tokens/`

-   `export-tokens/build.js`  
    主建管弦乐. 运行验证,构建符号输出,合并主题文件,生成类型,并生成PrimeVue Cfig.
    
    -   **能编辑吗 ?** **对**,用于改变构建流程或增加新产出.
-   `export-tokens/constants.js`  
    路径的中央配置,令牌组列表,Tailwind映射/用途,已知的例外,以及手动组件的覆盖.
    
    -   **能编辑吗 ?** **对**。这是在添加令牌组、映射或BCC手册覆盖时需要更新的主要文件.
-   `export-tokens/sd-formats.js`  
    注册自定义样式词典会转换/格式(JS有 refs, CSS变量, Tailwind 公用事业).
    
    -   **能编辑吗 ?** **对**,如果需要更改输出格式行为.
-   `export-tokens/primevue-config.js`  
    生成 `build/primevue/config.js` 从已建的符号 + Aura 预设(`@primeuix/themes/aura`)并应用了超逻辑/验证.
    
    -   **能编辑吗 ?** **对**,用于 PrimeVue 映射/分辨率逻辑变化.
-   `export-tokens/validation.js`  
    验证光/暗符号对称性,并警告缺少组件主题覆盖.
    
    -   **能编辑吗 ?** **对**,当调整验证规则.
-   `export-tokens/bcc-build.js`  
    合并创建 `tokens.css` 财务报告和审定财务报表 `tailwind.css` 产生的光/暗产出.
    
    -   **能编辑吗 ?** **对**如果合并产出战略需要改变.
-   `export-tokens/type-gen.js`  
    生成 `.d.ts` cSS文件的模块声明.
    
    -   **能编辑吗 ?** **对**,用于修改已公布的类别声明.

## 许可证

麻省理工学院

## 常见问题

### @bcc-code/design-tokens 是什么？

设计符号构建系统

### 如何安装 @bcc-code/design-tokens？

在项目目录运行 npm install @bcc-code/design-tokens，或使用 pnpm add / yarn add / bun add。它还需要宿主项目提供 peer 依赖：@primeuix/themes（^2\.0\.0）。npm 7 及以上与 pnpm 8 及以上默认会自动安装必需的 peer 依赖，Yarn 需要手动安装。

### @bcc-code/design-tokens 支持 TypeScript 吗？

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

### @bcc-code/design-tokens 支持 ESM 还是 CommonJS？

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

### @bcc-code/design-tokens 需要什么版本的 Node\.js？

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

### @bcc-code/design-tokens 可以商用吗？

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

### @bcc-code/design-tokens 的下载量有多少？

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

### @bcc-code/design-tokens 还在维护吗？

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

