# @bergetai/ui 中文文档

规范地址：https://npmcn.com/package/%40bergetai/ui/

版本：0\.29\.0
npm 元数据更新时间：2026-10-27T13:20:38.535Z
中文译文更新时间：2026-11-07T22:55:49.522Z
软件包许可：MIT

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

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

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

- 包体积（解压后）：1.1 MB，401 个文件
- 模块格式：ES Module
- TypeScript 类型：包内自带
- 运行依赖：8 个
- peer 依赖：react ^19\.0\.0，shiki ^4\.3\.1，three ^0\.184\.0，motion ^12\.38\.0，react-dom ^19\.0\.0，tailwindcss ^4\.1\.0，lucide-react ^1\.23\.0，@react-three/fiber ^9\.6\.1
- 首次发布：2026-07-06T06:32:35.588Z
- 最新版本发布：2026-10-27T13:20:38.266Z
- 近 30 天下载量：6567（2026-10-08 至 2026-11-06，npm 官方下载统计）
- 已发布版本数：73（近 12 个月 73 个）

## 中文简介

Berget Design System - 有控制台美学灵感的斯堪的纳维亚人设计系统

## 安装

```sh
npm install @bergetai/ui
```

也可以使用：`pnpm add @bergetai/ui`、`yarn add @bergetai/ui`、`bun add @bergetai/ui`

## README

# @bergetai/ ui (英语)

Berget的反相设计系统,建立在 [基础UI](https://base-ui.com/), Tailwind CSS v4, 和阴影组件常规。 向公众公布npm登记 `console`, (中文(简体) ), `landing-page`,还有凯克洛克主题.

## 安装

```sh
pnpm add @bergetai/ui
```

### 同伴依赖关系

| 软件包 | 范围 | 为什么 |
| --- | --- | --- |
| `react` 编号 : `react-dom` | `^19` | App 拥有 React 运行时间( 单个副本) |
| `tailwindcss` | `^4.1` | 在消费者的建筑中发生公用事业发电 |
| `lucide-react` | `^1` | 图标集 |
| `motion` | `^12` | 动画( 仅在使用时) |
| `shiki` | `^4` | 语法突出显示(仅指 `@bergetai/ui/shiki`(中文(简体) ) |
| `three`, (中文(简体) ), `@react-three/fiber` | 选项 | 仅 `@bergetai/ui/neural-flow` (WebGL插图) |

pnpm~8和npm~7自动安装同位素;没有额外管理.

## 设置( 一个样式表, 导入一次)

```css
/* app/globals.css */
@import 'tailwindcss';
@import '@bergetai/ui/styles';
/* No @source needed: the stylesheet scans this package's own dist for you. */
```

进口订单事项: `@import 'tailwindcss'` 先说 `@bergetai/ui/styles` (托盘,基层,组件键框). 别 `@import 'tailwindcss'` 别的地方.

为什么 `@source` 需要: 尾风忽略 `node_modules` 在内容检测时, 因此已运出样式表会通过一个 `@source` 这决定了相对自己。 如果您从 monrepo 源( 故事本) 导入工作表, 请添加自己的工作表 `@source` 给包裹的 `src/` 换句话说.

## 使用量

```tsx
import { Button, Card, CardHeader, CardTitle, CardContent } from '@bergetai/ui';
```

-   **RSC安全无虞.** 每个互动模块 `"use client"` 预告; 渲染 `@bergetai/ui` 组件直接来自服务器组件.
-   **组成,不是包装.** 应用基本UI语义:使用 `render` 道具(从未) `asChild` ——被贬)和作风 `<a>` 元素为 `buttonVariants()` 而不是通过 `Button`。 。 。 .
-   **只有托肯丝.** 永远不要使用原始调色板类( E)`bg-blue-500`),任意值(`p-[13px]`),或手动 `dark:` 色彩覆盖——暗模式和光模式完全由符号驱动(`[data-theme='light']`) (中文(简体) ). `className` 上的组件是用于布局(边距、位置、宽度),而不是重新安放;缺失的外观作为变体属于DS.
-   **亚伯帕斯出口.** `@bergetai/ui` (构成部分), `@bergetai/ui/styles` (CSS标志), `@bergetai/ui/shiki` (亮点), `@bergetai/ui/neural-flow` (网络GL;牵引) `three` 作为可选对等点).

## 建筑

-   `src/primitives/` —— 阴影生成的 Base UI 原始(通过 `npx shadcn@latest add`,从不手工修改;刷新 `--overwrite`(中文(简体) )
-   `src/components/` - 品牌包装:指使、cva变体, `data-slot` 属性, 公共 API
-   `src/styles/index.css` ——象征真理之源:品牌调色板(A节,OKLCH)-语义符号(B)-组件范围符号(C)-尾风 `@theme` 绘图(D)

发展: `pnpm i` 在回波根,然后 `pnpm --filter @bergetai/ui dev` (建设表), `pnpm storybook`, (中文(简体) ), `pnpm typecheck`, (中文(简体) ), `pnpm spellcheck`构成部分工作 `.agents/skills/add-component` 技术.

释放: `workflow_dispatch` 打开 [`release.yml`](https://npmcn.com/package/.github/workflows/release.yml) 通过信任出版(OIDC)向 npm 注册机构提供版本、标签并发布.

## 常见问题

### @bergetai/ui 是什么？

Berget Design System - 有控制台美学灵感的斯堪的纳维亚人设计系统

### 如何安装 @bergetai/ui？

在项目目录运行 npm install @bergetai/ui，或使用 pnpm add / yarn add / bun add。它还需要宿主项目提供 peer 依赖：react（^19\.0\.0）、shiki（^4\.3\.1）、motion（^12\.38\.0）、react-dom（^19\.0\.0）、tailwindcss（^4\.1\.0）、lucide-react（^1\.23\.0）。npm 7 及以上与 pnpm 8 及以上默认会自动安装必需的 peer 依赖，Yarn 需要手动安装。

### @bergetai/ui 支持 TypeScript 吗？

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

### @bergetai/ui 支持 ESM 还是 CommonJS？

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

### @bergetai/ui 可以商用吗？

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

### @bergetai/ui 的下载量有多少？

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

### @bergetai/ui 还在维护吗？

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