# @adobe/design-data-wasm 中文文档

规范地址：https://npmcn.com/package/%40adobe/design-data-wasm/

版本：0\.15\.0
npm 元数据更新时间：2026-11-07T00:55:28.349Z
中文译文更新时间：2026-11-06T20:16:28.482Z
软件包许可：Apache-2\.0

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

原始 npm 页面：https://www.npmjs.com/package/%40adobe/design-data-wasm
原文对照：https://npmcn.com/package/%40adobe/design-data-wasm/?lang=original
项目主页：https://github.com/adobe/spectrum-design-data/tree/main/sdk/wasm#readme
源码仓库：https://github.com/adobe/spectrum-design-data

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

- 包体积（解压后）：30.8 MB，14 个文件
- 模块格式：ES Module
- TypeScript 类型：包内自带
- Node.js 要求：\>=20\.12\.0
- 运行依赖：0 个
- 首次发布：2026-07-20T18:41:00.058Z
- 最新版本发布：2026-11-07T00:55:27.979Z
- 近 30 天下载量：2389（2026-10-05 至 2026-11-03，npm 官方下载统计）
- 已发布版本数：31（近 12 个月 31 个）

## 中文简介

WebAssembly 为设计-数据-核心——查询、验证、解析、diff和Spectrum设计令牌的登记助手

## 安装

```sh
npm install @adobe/design-data-wasm
```

也可以使用：`pnpm add @adobe/design-data-wasm`、`yarn add @adobe/design-data-wasm`、`bun add @adobe/design-data-wasm`

## README

# [**@ adobe/ dedesign-data-wasm (英语)**](https://github.com/adobe/design-data-wasm)

网页大会装订 [`design-data-core`](https://npmcn.com/package/%40adobe/core/) - 查询、验证、, 解析,以及来自 JavaScript 或 TypeScript 的 diff Spectrum 设计符号, 带有 零本地依赖.

生成类型Script类型直接取自 Rust 类型通过 [tsy- next (帮助)](https://github.com/nickel-lang/tsify-next) ——无手工维护 平行类型表面.

## 安装

```sh
pnpm add @adobe/design-data-wasm
```

## 释放核查

运行 `moon run sdk-wasm:verify-package` 建立目标并检查 发布前装入的软件包 。 检查在临时安装焦油丸 工作空间外的消费者和通过节点运行嵌入式数据查询 和网络入口。 还检查绑定物、类型和二进制 已存在且有效。 它不发布软件包.

抓图和稳定的发布工作流程在下载后运行相同的检查 他们的建筑文物.

## 使用量

### 节点.js(同步-否) `init()` (所需)

这个 `node` 导出条件确定为同步的 CommonJS 构建; 已命名 进口通过Cjs-moule-lexer在无害环境管理中发挥作用.

```js
import { Dataset, getValues, findValue } from "@adobe/design-data-wasm";

// Use the canonical embedded Spectrum dataset (zero config):
const ds = Dataset.embedded();

// Or build a dataset from your own token objects:
const tokens = JSON.parse(fs.readFileSync("my-tokens.json", "utf-8"));
const customDs = Dataset.fromTokens(tokens);

// Query
const colorTokens = ds.query("property=color,colorScheme=dark");
console.log(colorTokens[0].name, colorTokens[0].raw.value);

// Validate (relational rules — structural/JSON-Schema checks require the CLI)
const { valid, errors } = ds.validate();

// Resolve a property in a given context
const result = ds.resolve("background", {
  colorScheme: "dark",
  scale: "medium",
});
if (result)
  console.log(result.token.raw.value, "specificity:", result.specificity);

// Diff two datasets
const oldDs = Dataset.fromTokens(oldTokens);
const newDs = Dataset.fromTokens(newTokens);
const diff = oldDs.diff(newDs);
console.log(`${diff.added.length} added, ${diff.deleted.length} deleted`);
```

### 浏览器/ 捆绑器( 需要) `await init()`(中文(简体) )

这个 `browser` 导出条件解决了浏览器的无害环境管理构建。 打电话 `init()` 带有 URL 的 `.wasm` 使用任何 API 之前的文件.

> **Deno、Bun和非标准捆绑商的说明:** 软件包 `default` 导出 条件也解决网络(浏览器无害环境管理)的构建,因此运行时间或捆绑器可以 不尊重这个 `node` 或者说 `browser` 条件会得到这个建筑和 **必须** 调用 `await init()` 在使用任何 API 之前.

```js
import init, { Dataset } from "@adobe/design-data-wasm";
// or explicit browser path:
import init, {
  Dataset,
} from "@adobe/design-data-wasm/pkg/web/design_data_wasm.js";

await init(); // pass wasm URL if needed: await init(new URL('./wasm/design_data_wasm_bg.wasm', import.meta.url))

const ds = Dataset.fromTokens(tokens);
const results = ds.query("property=color");
```

## API 密码

### 遗留兼容性输出

`ds.legacyOutput()` 返回由遗留输出文件名键入的普通对象. 每个文件包含由遗留名键入的符号条目,包括已重建 模式集和别名。 嵌入式数据集包括组件/托接关系. 不包含非默认对比记录, 匹配本地图遗留输出 .

```js
const byFile = ds.legacyOutput();
const flat = Object.assign({}, ...Object.values(byFile));
console.log(flat['picker-border-width'].value);
```

### `Dataset`

| 方法 | 回返 | 说明 |
| --- | --- | --- |
| `Dataset.embedded()` | `Dataset` | 打开嵌入式光谱数据集(预建) `.redb` 缓存 — 0 配置 。 完整符号数据集编译为 `.wasm` 二进制通过 `include_bytes!`; 使用 `fromTokens()` 相反,如果二进制大小是一个问题. |
| `Dataset.fromTokens(tokens)` | `Dataset` | 从一个原始代号 JSON 对象的数组建立数据集 |
| `ds.query(filterExpr)` | `TokenResult[]` | 过滤符号 。 语法 `key=value` 组合成对 `,` (AND)或 (AND) (韩语) `|` (或); (中文(简体) ); `!=` 否定; `*` 通配符 |
| `ds.validate()` | `ValidationResult` | 关系论证. `valid`, (中文(简体) ), `errors[]`, (中文(简体) ), `warnings[]` |
| `ds.resolve(property, context)` | `ResolveResult | undefined` | 在模式设置上下文中解析属性, 例如 . `{ colorScheme: 'dark' }` |
| `ds.diff(otherDataset)` | `DiffResult` | 语义入道. 字段 : `renamed`, (中文(简体) ), `deprecated`, (中文(简体) ), `reverted`, (中文(简体) ), `added`, (中文(简体) ), `deleted`, (中文(简体) ), `updated` |
| `ds.tokenCount()` | `number` | 数据集中的令牌数 |

### 登记册助手

这些与被腐烂的 `@adobe/design-system-registry` API,接受 `{ values: [...] }` JSON 形状来自 `@adobe/spectrum-design-data/registry/*.json`。 。 。 .

| 函数 | 说明 |
| --- | --- |
| `getValues(registry)` | 返回所有值 ID |
| `findValue(registry, term)` | 通过身份或别名查找条目 |
| `hasValue(registry, term)` | 检查身份或别名是否存在 |
| `getDefault(registry)` | 返回默认条目 |
| `getActiveValues(registry)` | 返回所有未折旧的条目 |

### 嵌入式登记册助手

由编译时间嵌入的登记册数据支持的快速查询(没有 JSON 参数) 所需:

| 函数 | 说明 |
| --- | --- |
| `getFieldValues(fieldName)` | 名称字段的所有 IDs+aliases ()`"property"`, (中文(简体) ), `"component"`, (...) (中文(简体) ) |
| `hasFieldValue(fieldName, value)` | 名称字段的成员检查 |
| `getAdvisoryFields()` | 咨询(非规范)领域名称 |

## 类型脚本

类型来自rust structs;不需要并行声明.

```ts
import type {
  TokenResult,
  ValidationResult,
  DiffResult,
  ResolveResult,
} from "@adobe/design-data-wasm";
```

## 许可证

阿帕奇-2.0 — 见 [自由主义](https://npmcn.com/package/LICENSE)。 。 。 .

## 常见问题

### @adobe/design-data-wasm 是什么？

WebAssembly 为设计-数据-核心——查询、验证、解析、diff和Spectrum设计令牌的登记助手

### 如何安装 @adobe/design-data-wasm？

在项目目录运行 npm install @adobe/design-data-wasm，或使用 pnpm add / yarn add / bun add。

### @adobe/design-data-wasm 支持 TypeScript 吗？

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

### @adobe/design-data-wasm 支持 ESM 还是 CommonJS？

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

### @adobe/design-data-wasm 需要什么版本的 Node\.js？

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

### @adobe/design-data-wasm 可以商用吗？

@adobe/design-data-wasm 使用 Apache-2\.0 许可。宽松许可：允许商业使用、修改和再分发，并附带明确的专利授权；分发时需保留许可与 NOTICE 文件，修改过的文件要注明改动。以上为概括，不构成法律意见，请以许可原文为准。

### @adobe/design-data-wasm 的下载量有多少？

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

### @adobe/design-data-wasm 还在维护吗？

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