# @burdenoff/fe-libs 中文文档

规范地址：https://npmcn.com/package/%40burdenoff/fe-libs/

版本：2026\.1108\.3
npm 元数据更新时间：2026-11-08T07:43:46.777Z
中文译文更新时间：2026-11-08T20:09:20.362Z
软件包许可：未声明

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

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

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

- 包体积（解压后）：9 MB，2331 个文件
- 模块格式：ES Module
- TypeScript 类型：包内自带
- 运行依赖：37 个
- peer 依赖：react ^19\.0\.0，fflate ^0\.8\.2，graphql ^16\.12\.0，zustand ^5\.0\.5，react-dom ^19\.0\.0，pdfjs-dist ^6\.2\.108，react-router ^8\.3\.0，@xyflow/react ^12\.10\.0，framer-motion ^12\.0\.0，@apollo/client ^4\.0\.9，@capacitor/app ^8\.1\.0，@iconify/react ^5\.2\.0 \|\| ^6\.0\.0，livekit-client ^2\.22\.3，@capacitor/core ^8\.3\.1，@capacitor/share ^8\.0\.1，@capacitor/toast ^8\.0\.1，@capacitor/device ^8\.0\.2，@capacitor/dialog ^8\.0\.1，@capacitor/browser ^8\.0\.3，@capacitor/haptics ^8\.0\.2，@capacitor/network ^8\.0\.1，@capacitor/keyboard ^8\.0\.3，@capacitor/clipboard ^8\.0\.1，@capacitor/status-bar ^8\.0\.2，@tanstack/react-query ^5\.0\.0，@capacitor/geolocation ^8\.2\.0，@capacitor/preferences ^8\.0\.1，@capacitor/action-sheet ^8\.1\.1，@capgo/native-purchases ^8\.4\.0，@capacitor/splash-screen ^8\.0\.1，@capgo/capacitor-updater ^8\.47\.5，@capacitor/push-notifications ^8\.0\.3
- 首次发布：2026-05-11T04:04:12.619Z
- 最新版本发布：2026-11-08T07:43:46.609Z
- 近 30 天下载量：49100（2026-10-09 至 2026-11-07，npm 官方下载统计）
- 已发布版本数：613（近 12 个月 613 个）

## 中文简介

负担前端原始和域库

## 安装

```sh
npm install @burdenoff/fe-libs
```

也可以使用：`pnpm add @burdenoff/fe-libs`、`yarn add @burdenoff/fe-libs`、`bun add @burdenoff/fe-libs`

## README

# @ taffleoff/ fe-libs

所有Burdenoff出品的前端原始和域库.

## 建筑

这是一个 **第一层软件包** - 一个单一的包,所有原始人都有子路径出口.

## 软件包结构

```
@burdenoff/fe-libs/
├── /workflow    - Workflow primitives (Node, Canvas, Edge)
├── /tag         - Tag components
├── /form        - Form components
├── /button      - Button primitives
└── /shared      - Shared utilities (cn, types)
```

## 使用量

```typescript
import { Button } from '@burdenoff/fe-libs/button';
import { mockProducts } from '@burdenoff/fe-libs/shared/utils/mockData';
import { cn } from '@burdenoff/fe-libs/shared';
```

## 发展

```bash
# Install dependencies
bun install

# Build library
bun run build

# Type check
bun run type:check

# Run all checks
bun run sanity
```

## 构成部分

### 工作流量

-   **工作流程节点** - 创建具有状态指标的工作流程节点
-   **工作流程** - 有网格背景的工作流程构建器的 Canvas 组件

### 按钮

-   **按钮** - 有变体的Versatile按钮组件(默认、破坏性、轮廓、二级、幽灵、链接)

### 共享

-   **(单位:千美元)** - 用于合并Tailwind类的工具

## 外壳内生( 仅应用外壳)

`@burdenoff/fe-libs/shell-native` 是 shell- side 本地运行时间: 控制器 (iOS/Android),电子桌面和PWA接线在一个入站点. **应用程序弹壳 导入它;微前端从来不做** - MFEs通过贝壳说话 `window.__burdenoffNativeBridge` (单位:千美元)`@burdenoff/fe-libs/shared/native`) (中文(简体) ).

开一次车 `main.tsx`,在反应挂载前:

```ts
import { bootNativeShell, registerDeepLinkNavigator } from '@burdenoff/fe-libs/shell-native';

const shell = bootNativeShell({
  product: 'vibecontrols',
  appName: 'VibeControls',
  // Optional plugins are loaded ONLY through these loaders, so web-only shells
  // never bundle them.
  plugins: {
    updater: () => import('@capgo/capacitor-updater'),
    pushNotifications: () => import('@capacitor/push-notifications'),
  },
  push: { enabled: true, onToken: (token) => void registerDevice(token) },
  runtimeHooks: { syncPendingOperations: refetchAll, saveState: flushDrafts },
});

// Inside the router:
registerDeepLinkNavigator((path) => navigate(path));
// After the first meaningful paint:
void shell.markAppReady();
```

Bot 顺序( 每个步骤都是单独尝试/抓取的—— 靴子从不扔出): 预览 ~ 奥塔 `notifyAppReady` • 自动直接截取 \* 外部 URL 打开器 \* 本地 桥+站台类 设备信息 状态栏主题收听器 键盘 Android后按键 – 深度链接 – 网络 – app-state switchs – 推收听器 – 推收听器 喷出安全计时器(本土) → PWA 服务员(网络) → 桌面外壳靴.

贝壳和MFes可以依赖:

-   **窗口全局** —— 说 `__burdenoffNativeBridge`, (中文(简体) ), `__burdenoffDeviceInfo`, (中文(简体) ), `__burdenoffOpenExternal(url)`, (中文(简体) ), `__burdenoffPushToken`, (中文(简体) ), `__burdenoffPwaInstallPrompt`。 。 。 .
-   **身体类** —— 说 `platform-ios | platform-android | platform-web`, (中文(简体) ), `platform-native`, (中文(简体) ), `platform-preview`, (中文(简体) ), `keyboard-open`。 。 。 . `<html>` 携带 `data-platform` 和 (在预览中) `data-native-preview`。 。 。 .
-   **CSS var (英语)** —— 说 `--keyboard-height` (关闭时为0px).
-   **窗口事件** —— 说 `burdenoff:appReady`, (中文(简体) ), `burdenoff:appStateChange`, (中文(简体) ), `burdenoff:networkStatusChange`, (中文(简体) ), `burdenoff:keyboardWillShow|DidShow|WillHide|DidHide`, (中文(简体) ), `burdenoff:pushToken`, (中文(简体) ), `burdenoff:pwaUpdateReady`, (中文(简体) ), `burdenoff:pwaInstalled`, (中文(简体) ), `burdenoff:pwaInstallAvailable`。贝壳听 `burdenoff:statusBarTheme`。 。 。 .

### 本地预览旗

`?__nativePreview=ios|android|pwa|desktop` 使已安装的太平洋铬在 纯浏览器( 已存在于 `sessionStorage`,清除 `off`) (中文(简体) ). 没错 **仅列报** —— 真正的插件呼叫保持锁定 `Capacitor.isPluginAvailable`,而旗被忽略在一个真正的本土应用程序中.

### 构建时间配置生成器

`defineCapacitorConfig(nativeConfig)`, (中文(简体) ), `defineWebManifest(nativeConfig)` 财务报告和审定财务报表 `renderServiceWorker(nativeConfig, version)` 是纯函数( 无) `@capacitor/*` 进口),用于排放每个产品 `capacitor.config.ts`, (中文(简体) ), `public/manifest.json` 财务报告和审定财务报表 `public/sw.js` 从其 `native.config.json` (单位:千美元)`NativeConfig`) (中文(简体) ).

## 原始颜色、画布符和共享的 ESLint 守护

UI代码只使用语义符号. `createEslintConfig()` 从 `@burdenoff/fe-libs/shared/config/eslint.config.mjs` 报告,作为 **错误**, (中文(简体) ), 六进制/ `rgb()` 编号 : `hsl()` 编号 : `oklch()` 升和 Tailwind调色板类 (单位:千美元)`bg-red-500`, (中文(简体) ), `text-white`, (中文(简体) ), `border-t-gray-200`,以字符串字数和 模板字符串。 未检查注释和测试文件 .

-   仍然背负生色债务的还款可以通过 `rawColors: 'warn'` 时 把它当作一个跟踪的,临时的退出.
-   带有独立 ESLint 配置的回波 应用了相同的守护 `'no-restricted-syntax': ['error', ...rawColorRestrictedSyntax()]`。 。 。 .

工作流程构建器、图形和绘图器使用画布符号 `tokens.css`。 。 。 . 每一个别名都有 `chart-*` 编号 : `status-*` 表面标志,所以它 遵循轻/暗模式、品牌和表达主题:

| 组 | 键 |
| --- | --- |
| 帆布 | `--color-canvas-{bg,grid,selection,minimap-bg,minimap-node,minimap-mask,control-bg}` |
| 节点表面 | `--color-node-{bg,bg-hover,border,border-hover,border-selected,text,text-muted,handle,handle-connected}` |
| 节点类别 | `--color-node-{trigger,action,logic,loop,data,integration,ai,human,utility,end,default}` 加号 `-subtle` |
| 节点状态 | `--color-node-state-{idle,queued,running,success,warning,error,skipped}` |
| 边缘 | `--color-edge-{default,hover,selected,active,success,error,compatible,incompatible,label-bg,label-text}` |
| 数据类型 | `--color-datatype-{string,number,boolean,object,array,date,binary,any}` |

`app-shell.css` 将它们映射到Tailwind公用事业(`bg-node-trigger`, (中文(简体) ), `stroke-edge-default`, (中文(简体) ), `ring-node-state-running`(中文(简体) ). 拥有自己的外壳 `@theme` 进口 `@burdenoff/fe-libs/shared/styles/canvas-theme.css` 换句话说. 对于回放流道具, SVG 属性和内置样式, 使用辅助工具 `@burdenoff/fe-libs/shared/utils` (单位:千美元)`nodeCategoryColor`, (中文(简体) ), `edgeColor`, (中文(简体) ), `nodeStateColor`, (中文(简体) ), `dataTypeColor`, (中文(简体) ), `chartSeriesColor(chartSeriesIndex(key))`(中文(简体) ) 和文字类记录`nodeCategoryClasses`, (中文(简体) ), `nodeStateRingClasses`, (中文(简体) ), `dataTypeTextClasses`) (中文(简体) ).

## 明确的产品分析和退出

Circle同志的默认可观察性配置 使用共享的 Rybbit 水槽的清晰 事件传输而不是提供者脚本的自动抓取。 只有五颗 审查 `comradecircle.*` 漏斗事实,解决已知的路由模板,并且永远不包含 资源标识、查询字符串、片段、页面标题、裁判员、饼干或无记名信头. 公众摄取端点需要公共站点ID,而不是客户端侧API密钥.

主机必须设置 `privacyConsent: true` 财务报告和审定财务报表 `privacyConsentReopen: true`后者保留 隐私选择控制在决定后可见,这样人们就可以撤回或改变选择. 每次活动前都要检查同意书、GPC和DNT。 退出和卸载未终止 请求; 汇没有重放/重试队列 。 Alpha 没有默认的站点, 不重复使用 生产地点。 MFEs 仍然通过输入的事件发出 `useEventBus()` 只有这个.

`eventEndpoint` 财务报告和审定财务报表 `routeTemplates` 选择进入 `AppShellObservabilityConfig.rybbit` 选项. 无法匹配的路由以明确模式关闭 。 其他产品保留其现有的脚本模式; 这个产品通过不是声称 遗产提供者的自动收听者支持 撤销。 原脚本装入标准被明确摄入的校验所取代 因为删除已装入的第三方脚本不会删除它所安装的收听器.

## 技术堆栈

-   反应 19
-   类型脚本 5.9+
-   尾风CSS v4
-   Radix UI (用于可访问原始人)
-   Vite 7(用于建筑)

## 出口移民(BOFF-9417)

从首个包含 BOFF-9417 的 Calver 发布开始 无功能 `@burdenoff/fe-libs/workflow` 导出元数据已明确退出。 两个广告 目标(`dist/workflow.js` 财务报告和审定财务报表 `dist/workflow.d.ts`)没有参加经核实的 发布2026.1016.3包. 以前的WorkflowCanvas/WorkflowNode执行 被故意从源头清除 `f0920f9a` 在2026-01-15上;这一变化确实 不删除工作运行时间执行或恢复过时的UI。 现有 已公布的版本没有改变。 在限定的本地仓库外使用 库存不明;这并不是说不存在外部消费者.

当前的工作流程构建器功能属于 `@burdenoff/fluidgrids-fe-sdk` (WorkflowBuilder和WorkflowBuilder Core),而不是另一个微前端导入. 这些 API与被删除的通用画布/节点道具不同,需要明确 消费者迁移;它们不是一个滴入相容性适配器。 消费者应 在选择该 API 之前, 检查他们想要的工作流程行为 .

现有 `@burdenoff/fe-libs/shared/utils/mockData` 子路径被保留 。 5个 fixture 阵列现在在声明的同时有一个明确的运行时间构建条目. 归档核查员检查实际 npm 焦油中的字面导出/取出目标 发布;通配符导出模式和通用消费者兼容性不 由该存在检查证明。 普通释放自动化指定混凝土 CalVer版本;本出处注释不主张出版或主机采纳.

### 抓取的工作空间动作

使用 `graphqlFetchPinned` 当一个请求属于一个被捕获的演员或 工作空间。 它命名的导出也会使一个不兼容的主机- 图书馆的 pin 失败 在建设期间。 它拒绝一名失踪或已过期的被俘持枪人发出命令 从配置文件存储中不替换账户持有人, 刷新账户 会话,或重放一个响应. 通过输入的请求选项指定权限和上下文; 绑定模式 拒绝其它工作空间/文本覆盖 `extraHeaders`。来电者 在正常会话更新后提供当前证书,以及 在再次尝试之前审查一次失败或模棱两可的突变.

对于工作空间管理机构,重新使用共享准备警卫:

```ts
const prepared = await prepareWorkspaceRequest({
  url: resolveGatewayUrl('workspace', baseUrl),
  authToken,
  actorId,
  workspaceId,
  tenantId,
  currentQuery: query,
  signal,
});
prepared.assertCurrent();
const response = await graphqlFetchPinned({
  gateway: 'workspace',
  baseUrl,
  query,
  variables,
  authToken,
  workspaceId,
  workspaceToken: prepared.workspaceToken,
  signal,
});
```

`prepareWorkspaceRequest` 约束配置、演员和工作空间的权威和检查 象征性发行期间同时进行更改。 传递抓取的请求上下文 当周围的身份发生变化时,取消过时的读取。 分区和 重挂载用户界面查询观察者, 由 actor/ context 进行; 仅一个响应缓存键 对请求的全权证书不具有约束力。 默认 `refreshable` 模式保留 基于配置的会话恢复。 现有明确客户需要 个别当局/重新审查,然后采取固定行为;这种添加剂 API不追溯修复这些呼叫者.

## 常见问题

### @burdenoff/fe-libs 是什么？

负担前端原始和域库

### 如何安装 @burdenoff/fe-libs？

在项目目录运行 npm install @burdenoff/fe-libs，或使用 pnpm add / yarn add / bun add。它还需要宿主项目提供 peer 依赖：react（^19\.0\.0）、graphql（^16\.12\.0）、zustand（^5\.0\.5）、react-dom（^19\.0\.0）、react-router（^8\.3\.0）、@apollo/client（^4\.0\.9）、@tanstack/react-query（^5\.0\.0）。npm 7 及以上与 pnpm 8 及以上默认会自动安装必需的 peer 依赖，Yarn 需要手动安装。它还提供命令行工具 a11y-audit、burdenoff-i18n、graphql-schema-drift，可以用 npx a11y-audit 直接运行。

### @burdenoff/fe-libs 支持 TypeScript 吗？

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

### @burdenoff/fe-libs 支持 ESM 还是 CommonJS？

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

### @burdenoff/fe-libs 可以商用吗？

@burdenoff/fe-libs 使用 未声明 许可。package\.json 没有声明许可证。没有许可证的代码默认保留全部权利，商用前请联系作者或查看仓库中的 LICENSE 文件。以上为概括，不构成法律意见，请以许可原文为准。

### @burdenoff/fe-libs 的下载量有多少？

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

### @burdenoff/fe-libs 还在维护吗？

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