# @bitbaum/sitekit 中文文档

规范地址：https://npmcn.com/package/%40bitbaum/sitekit/

版本：0\.7\.0
npm 元数据更新时间：2026-11-05T23:57:25.013Z
中文译文更新时间：2026-11-08T04:32:15.298Z
软件包许可：MIT

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

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

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

- 包体积（解压后）：120 kB，42 个文件
- 模块格式：ES Module
- TypeScript 类型：包内自带
- Node.js 要求：\>=20
- 运行依赖：1 个
- peer 依赖：react \>=18
- 首次发布：2026-09-05T14:59:34.341Z
- 最新版本发布：2026-11-05T23:57:24.685Z
- 近 30 天下载量：4452（2026-10-08 至 2026-11-06，npm 官方下载统计）
- 已发布版本数：9（近 12 个月 9 个）

## 中文简介

网站作为数据:一个在运行时验证的区块形状的封闭联盟,一套反应渲染器,以及每个场的出处,这样一个生成的站点就可以证明它是虚构的.

## 安装

```sh
npm install @bitbaum/sitekit
```

也可以使用：`pnpm add @bitbaum/sitekit`、`yarn add @bitbaum/sitekit`、`bun add @bitbaum/sitekit`

## README

# @bitbaum/ sitekit (英语)

网站作为数据.

一个网站是网页;一个网页是各节;各节来自 **关闭** 工会 在运行时Zod验证形状。 一组反光渲染器绘制 网站。 一种来源的侧车记录 每一个生成的球场都来自——所以 "我们虚构了什么"是一种断言,而不是承诺.

从 [子系统](https://github.com/bitbaum/substrata)主办网站 型号(2026-08). 在橙猫的ADR-0003(现场工厂)中决定.

## 为什么一个封闭的工会

生成器排放 **数据与本方案相对应** 是一个任务与 可机器校验结果; 生成器的组件不是。 每场 质量成为渲染器的属性——固定 `cards` 渲染器 改进所有生成的网站。 计划就是审查的地方: `validateSite()` 返回时 `path: message` 一个模型可以直接操作错误 .

当前类型 : `hero` (带有可选的CTAs), `prose`, (中文(简体) ), `stats`, (中文(简体) ), `meter`, (中文(简体) ), `cards`, (中文(简体) ), `definitions`, (中文(简体) ), `feature` (一个数字旁边的故事), `contact` (地点、地址、小时——存在保护地点), `faq`, (中文(简体) ), `index`, (中文(简体) ), `table`。大多数类型需要可选 `anchor`和计划拒绝 任何索引条目 或英雄动作 指向一个碎片... ...没有任何东西携带。 扩大工会是本协议中的一项蓄意行为——一项新的 有其计谋、制造器和试验的乐园 每个消费者在下一个版本的起落架上都得到它.

## 安装

```bash
pnpm add @bitbaum/sitekit
```

仅限无害环境管理. `react >= 18` 是同级依赖关系 `@bitbaum/sitekit/react`; 词根 导出为无框架(一个节点生成器或 CI 检查可以不用React).

## 使用

```ts
import { validateSite, siteNavItems, sitePageAt, pageRendersOwnHeader } from '@bitbaum/sitekit';

const result = validateSite(generatorOutput);
if (!result.success) throw new Error(result.errors.join('\n'));
const site = result.data; // fully typed SiteSpec from here on
```

```tsx
import Link from 'next/link';
import { SiteMasthead, SiteFooter, SiteSections } from '@bitbaum/sitekit/react';

<SiteMasthead chrome={site.chrome} navItems={siteNavItems(site.pages)} currentPath={path} Link={Link} />
<SiteSections sections={page.sections} />
<SiteFooter chrome={site.chrome} />
```

`Link` 是一个框架连接: 它默认为平地 `<a>`,这是 各地正确; 下一个. js 应用程序通过 `next/link` 获取客户端 导航回来.

## 应用程序外壳

产品应用软件使用与应用程序相同的主头、导航和页脚 现相. 导入 `@bitbaum/sitekit/styles.css` 一次 一次吗 没有尾风设置 (b) 出席大会所需的会议; `--sk-*` 变量映射到产品共享 设计标志。 现有文件站点保持其实用类外观.

```tsx
<SiteMasthead appearance="application" chrome={chrome} navItems={nav}
  currentPath="analyze" mainId="main-content" Link={Link}
  brand={<Brand />} actions={<AccountControl />} />
<SiteFooter appearance="application" chrome={chrome} Link={Link}
  links={[{ href: '/roadmap', label: 'Roadmap' }]} extra="Beta" />
```

组合应用程序菜单,通过 `navGroups` 并行 `navItems`每一个 组有一个 `label` 财务报告和审定财务报表 `items` 包含 `path`, (中文(简体) ), `label` 和可选 `description`导入 `SiteNavGroup` 从 `@bitbaum/sitekit/react` 用于输入 配置 。 非空组将平面应用程序导航替换为 一个本地披露和一个响应面板;省略或保留空组 平地API. 集团标签,目的地和说明属于主机.

```tsx
navGroups={[{ label: 'Create', items: [
  { path: 'write', label: 'Write', description: 'Start an article.' }
] }]}
```

运行 `pnpm exec playwright install --with-deps chromium` 在此之前 `pnpm run verify`。 。 。 . 现有的铬可以用 `PLAYWRIGHT_CHROMIUM_EXECUTABLE_PATH`。 。 。 . 浏览器回归使用公共渲染器和样式表,宽度为四个.

该软件包拥有响应菜单, 它的原生无贾瓦脚本倒置, 逃出/外出/路由解雇、跳过链接、活动状态、接触目标以及 页脚布局. 产品供应标签、导航数据、身份和账户 插槽 。 将共享的铬固定在这里,然后释放并更新消费者通过其 常规依赖性检查和部署管道.

## 证明——"虚无事实"背后的检查

一个封闭的图案邀请完成:一个模型交给了一个 `stats` 区域想要 数字在里面。 故缺为一等并打出. 发电机发出a 由 JSON 路径键入的侧车 :

```ts
import { assertDeliverable, notFoundPaths } from '@bitbaum/sitekit';

const provenance = {
  'chrome.name':                    { kind: 'scraped', url: 'https://cafe-beispiel.ch/' },
  'pages.0.sections.1.paragraphs.0':{ kind: 'operator' },   // a human typed it
  'pages.0.sections.4.cards.0.meta':{ kind: 'inferred' },   // a model invented it
  'pages.0.sections.7.rows.0.1':    { kind: 'not-found' },  // we looked; it isn't public
};

assertDeliverable(provenance); // throws: names the inferred path
notFoundPaths(provenance);     // the honest gaps — in a pitch, these ARE the pitch
```

`not-found` 是两者的区别 _不详_ 财务报告和审定财务报表 _空_: 它记录到 我们无法发现的是 关于你"诚实的句子而不是借口.

## 设计合同

造物主们 **语义工具类, 其他的** - 没有颜色, 脸,或者这个包裹里的光线飞船。 每个消费者都定义了标志 五十个站点共享一个渲染器 而不像一个公司. (除美学外,到处统一. 不要指向消费者 `@fleet/design-tokens` 价值——使事情看起来像舰队; 继承 _形状_,选择自己的价值。 )

分类渲染器使用, 由消费者的 Tailwind 主题定义:

| 组 | 类 |
| --- | --- |
| 文本 | `text-fg-primary` `text-fg-secondary` `text-fg-tertiary` `text-fg-muted` |
| 表面 | `bg-surface-page` `bg-surface-raised` |
| 边框 | `border-subtle` `border-strong` `divide-subtle` |
| 浓度状态( S) | `bg-accent` `decoration-accent` `bg-status-positive` `bg-status-warning` `bg-status-negative` |
| 类型 | `font-heading` `font-mono` `tracking-caps` `tracking-display` |
| 版式 | `max-w-shell` `max-w-prose` `scrollbar-hide` |

以 Tailwind 4 定义为 `@theme` 变量(`--color-fg-primary`, (中文(简体) ), `--font-heading`,并添加软件包到内容扫描中:

```css
@import 'tailwindcss';
@source '../node_modules/@bitbaum/sitekit/dist';
```

苏斯特拉塔 `app/globals.css` 是合同的参考执行.

## 不在此软件包中

-   **没有设计标志.** 见上文——这就是问题所在.
-   **没有刮刀.** `siteFromUrl()` (从现场取出,与 原产地)是计划中的下个模块;计划是它的目标.
-   **没有HTTP,没有框架.** 和舰队的每件包裹一样.

## 校验

```bash
pnpm run verify  # lint + typecheck + build + test — same command CI runs
```

测试导入软件包 **名称** (单位:千美元)`@bitbaum/sitekit`, (中文(简体) ), `@bitbaum/sitekit/react`),所以一个断了 `exports` 地图在 CI 失败, 不是在第一个消费者 .

* * *

部分 **[位点](https://bitbaum.orangecat.ch/)** 开放的AI-本土产品 在苏黎世建造的基础设施。 这里的每个软件包都列出使用该软件的应用程序: **[使用 sitekit 的应用程序](https://bitbaum.orangecat.ch/packages/#sitekit)**。 。 。 .

应用程序页脚可以通过 `groups: [{ label, links: [{ href, label }] }]` 页:1 语义导航组. 现有单位 `links` 继续支持。 消费者 可以配置 `--sk-header-height`, (中文(简体) ), `--sk-mobile-header-height`, (中文(简体) ), `--sk-display-weight`, (中文(简体) ), `--sk-display-leading`, (中文(简体) ), `--sk-display-tracking` 财务报告和审定财务报表 `--sk-footer-gap` 通过它们的主题适配器,而不替换共享的标记.

## 移动标签栏

`SiteTabBar` 为小屏幕(隐藏于 48rem上,由桅杆头导航接管. 传出 3-5 `{ path, label, icon }` 条目和当前路径;它使自己的空间器不隐藏内容.

使用 `SiteIcon` 对于图标—— `{ icon: <SiteIcon name="write" /> }` - 不是一个 unicode glyph: 集绘制于 `currentColor`图标和标签 颜色和当前标签是一条规则。 名称 : `SITE_ICON_NAMES`。通过 `tabBar` 改为 `SiteMasthead` 在同一页上 所以桅杆头 放下菜单 按钮,而不是重复标签栏的目的地 :

```tsx
<SiteMasthead appearance="application" tabBar navItems={nav} … />
<SiteTabBar items={nav.map((n) => ({ ...n, icon: <SiteIcon name={n.icon} /> }))} … />
```

## 常见问题

### @bitbaum/sitekit 是什么？

网站作为数据:一个在运行时验证的区块形状的封闭联盟,一套反应渲染器,以及每个场的出处,这样一个生成的站点就可以证明它是虚构的\.

### 如何安装 @bitbaum/sitekit？

在项目目录运行 npm install @bitbaum/sitekit，或使用 pnpm add / yarn add / bun add。它还需要宿主项目提供 peer 依赖：react（\>=18）。npm 7 及以上与 pnpm 8 及以上默认会自动安装必需的 peer 依赖，Yarn 需要手动安装。

### @bitbaum/sitekit 支持 TypeScript 吗？

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

### @bitbaum/sitekit 支持 ESM 还是 CommonJS？

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

### @bitbaum/sitekit 需要什么版本的 Node\.js？

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

### @bitbaum/sitekit 可以商用吗？

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

### @bitbaum/sitekit 的下载量有多少？

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

### @bitbaum/sitekit 还在维护吗？

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