# @ferrlabs/ui-foundation 中文文档

规范地址：https://npmcn.com/package/%40ferrlabs/ui-foundation/

版本：5\.8\.0
npm 元数据更新时间：2026-11-10T22:34:39.265Z
中文译文更新时间：2026-11-14T14:53:08.285Z
软件包许可：MIT OR Apache-2\.0

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

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

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

- 包体积（解压后）：70.4 kB，17 个文件
- 模块格式：ES Module
- TypeScript 类型：包内自带
- 运行依赖：2 个
- peer 依赖：tailwindcss ^4\.0\.0
- 首次发布：2026-09-27T09:58:24.264Z
- 最新版本发布：2026-11-10T22:34:38.908Z
- 近 30 天下载量：7851（2026-10-15 至 2026-11-13，npm 官方下载统计）
- 已发布版本数：5（近 12 个月 5 个）

## 中文简介

框架-不可知 FerrLabs 设计基础: SVG 图标,基础 CSS + 字体, Tailwind 预设符号. 由@ferrlabs/ui-ng和Astro网站直接使用.

## 安装

```sh
npm install @ferrlabs/ui-foundation
```

也可以使用：`pnpm add @ferrlabs/ui-foundation`、`yarn add @ferrlabs/ui-foundation`、`bun add @ferrlabs/ui-foundation`

## README

# @ferrlabs/ ui- foundation (英语)

框架-不可知FerrLabs设计基础. 捆绑在一起,什么是 原为三个独立的包件(`@ferrlabs/ui-icons`, (中文(简体) ), `@ferrlabs/styles`, (中文(简体) ), `@ferrlabs/ui-tailwind`所以消费者安装一个 包而不是三个。 在UI#105下被跟踪.

## 这里面是什么

| 子路径 | 什麽 | 用于 |
| --- | --- | --- |
| `@ferrlabs/ui-foundation/icons` | SVG 图标设定为原始字符串( Luide- inspirted strike 图标) | 反应 + Astro |
| `@ferrlabs/ui-foundation/styles/global.css` | 基础样式表 — 字体 + Tailwind 导入 + 品牌标志 | 每个应用程序 `global.css` |
| `@ferrlabs/ui-foundation/styles/tokens.css` | 品牌颜色 + 印刷符号(通过 `@theme`(中文(简体) ) | 应用程序/网站 |

## 使用量

### 反应应用程序

```ts
import { icons, type IconName } from '@ferrlabs/ui-foundation/icons';
```

```css
/* app/src/index.css */
@import '@ferrlabs/ui-foundation/styles/global.css';
```

### 天体站点

```astro
---
import { icons } from '@ferrlabs/ui-foundation/icons';
---
<div set:html={icons.shield} />
```

```css
/* site/src/styles/global.css */
@import '@ferrlabs/ui-foundation/styles/global.css';
```

## 半径符号

| 脚本 | 数值 | 尾风工具 | 使用 |
| --- | --- | --- | --- |
| `--radius-control` | 四进制 | `rounded-control` | 按钮、输入、选择、搜索、标签、小芯片 |
| `--radius-card` | 8个px | `rounded-card` | 卡片、菜单、弹出器、铁道物品 |
| `--radius-modal` | 12px 时速 | `rounded-modal` | 模块、切换面板、大表面 |
| `--radius-full` | 999px (英语) | `rounded-full` | 切换、外观、徽章、状态点 |

`.btn-primary` 财务报告和审定财务报表 `.btn-ghost` 使用情况 `--radius-control`。 。 。 .

## 旧套件的迁移

旧的套件(`@ferrlabs/ui-icons`, (中文(简体) ), `@ferrlabs/styles`, (中文(简体) ), `@ferrlabs/ui-tailwind`继续作为再出口贝壳在 过渡窗口 — 以您自己的速度更改导入 。 新消费者 应瞄准 `@ferrlabs/ui-foundation` 直接说.

## 许可证

根据其中任何一项颁发的许可证 [阿帕奇 - 2.0](https://npmcn.com/package/%40ferrlabs/ui-foundation/LICENSE-APACHE) 或者说 [麻省理工学院](https://npmcn.com/package/%40ferrlabs/ui-foundation/LICENSE-MIT)随便你.

Fraunces和DM Mono字体不在本许可范围内. 他们被拉进来了 `@fontsource/fraunces` 财务报告和审定财务报表 `@fontsource/dm-mono` 根据SIL Open Font License 1.1 的附属关系和保留,其中每个软件包的文本载运.

## 常见问题

### @ferrlabs/ui-foundation 是什么？

框架-不可知 FerrLabs 设计基础: SVG 图标,基础 CSS \+ 字体, Tailwind 预设符号\. 由@ferrlabs/ui-ng和Astro网站直接使用\.

### 如何安装 @ferrlabs/ui-foundation？

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

### @ferrlabs/ui-foundation 支持 TypeScript 吗？

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

### @ferrlabs/ui-foundation 支持 ESM 还是 CommonJS？

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

### @ferrlabs/ui-foundation 可以商用吗？

@ferrlabs/ui-foundation 使用 MIT OR Apache-2\.0 许可。可在 MIT、Apache-2\.0 中任选其一遵守。选择 MIT 时，宽松许可：允许商业使用、修改和再分发，通常只需在分发时保留原版权与许可声明。以上为概括，不构成法律意见，请以许可原文为准。

### @ferrlabs/ui-foundation 的下载量有多少？

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

### @ferrlabs/ui-foundation 还在维护吗？

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