# @dotcraft/avatar 中文文档

规范地址：https://npmcn.com/package/%40dotcraft/avatar/

版本：0\.11\.1
npm 元数据更新时间：2026-11-12T16:03:37.214Z
中文译文更新时间：2026-11-12T23:15:54.383Z
软件包许可：Apache-2\.0

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

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

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

- 包体积（解压后）：1.3 MB，234 个文件
- 模块格式：ES Module
- TypeScript 类型：包内自带
- 运行依赖：0 个
- peer 依赖：react ^19\.0\.0
- 首次发布：2026-09-08T03:06:14.912Z
- 最新版本发布：2026-11-12T16:03:36.743Z
- 近 30 天下载量：3182（2026-10-13 至 2026-11-11，npm 官方下载统计）
- 已发布版本数：47（近 12 个月 47 个）

## 中文简介

名称衍生出 DotCraft 外观和 React SVG 动画组件

## 安装

```sh
npm install @dotcraft/avatar
```

也可以使用：`pnpm add @dotcraft/avatar`、`yarn add @dotcraft/avatar`、`bun add @dotcraft/avatar`

## README

# @ dotcraft/ avatar (英语)

从特工名字里调出一个一致的DotCraft同伴 反应组件需要反应19; 软件包根没有反应.

## 安装

```shell
npm install @dotcraft/avatar
```

## 变相器

在应用程序中导入样式表一次 .

```tsx
import { Avatar } from '@dotcraft/avatar/react'
import '@dotcraft/avatar/styles.css'

export function AgentIdentity() {
  return <Avatar name="Reviewer" size={36} label="Reviewer" />
}
```

导入 `deriveAppearance` 从 `@dotcraft/avatar` 当应用程序需要相同时 名称生成的外观没有反应.

## 跟随指针

`useAvatarGaze` 将每个元件的相向向向指针。 打开它 只是在阿凡达闲置的时候 过 `within` 只在元素内部跟踪 `reach` 设置 在CSS像素中,视线距离阿凡达中心有多远达到极限.

```tsx
const face = useRef<HTMLSpanElement>(null)
useAvatarGaze(face, { enabled: state === 'idle' })

return <span ref={face}><Avatar name="Reviewer" size={60} state={state} motion="system" /></span>
```

## 收藏

外出会填补五个独立的空档: `head`, (中文(简体) ), `face`, (中文(简体) ), `hand`, (中文(简体) ), `back`,以及 `skin`每一个 条目 [登记](https://npmcn.com/package/%40dotcraft/avatar/src/items.ts) 携带稀有(`common` 改为 `legendary`),系列,以及 ;共享一个区域的项目从未一起出现。 名称引出每个 插槽的稀有的共享重量,所以传说中的物品是稀有而可及的. 使用 `equip(appearance, slot, id)` 更改一个位置并澄清相互冲突的位置 [目录](https://npmcn.com/package/%40dotcraft/avatar/src/decorationCatalog.ts) 用于显示名称、稀有铬颜色和系列标签.

效果属于以下物品: `chrome` 财务报告和审定财务报表 `holographic` 换上身体的涂料, 发光的东西脉冲, 和克伊环绕身体。 仅在44px及以上有运动效果 启用; 较小的可视化器使其静态相框, 和可视化器在20px和下放相,手, 覆盖皮肤, 和效果层完全。 该模型在 [规格/地貌/avatar-system.md](https://npmcn.com/specs/features/avatar-system.md)。 。 。 .

见 [类型脚本 SDK 引用](https://www.dotcraft.net/extend/sdks/typescript) 联 合 国 现有切入点.

## 常见问题

### @dotcraft/avatar 是什么？

名称衍生出 DotCraft 外观和 React SVG 动画组件

### 如何安装 @dotcraft/avatar？

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

### @dotcraft/avatar 支持 TypeScript 吗？

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

### @dotcraft/avatar 支持 ESM 还是 CommonJS？

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

### @dotcraft/avatar 可以商用吗？

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

### @dotcraft/avatar 的下载量有多少？

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

### @dotcraft/avatar 还在维护吗？

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

