# @bendyline/docblocks-react 中文文档

规范地址：https://npmcn.com/package/%40bendyline/docblocks-react/

版本：2\.7\.13
npm 元数据更新时间：2026-11-05T23:00:39.084Z
中文译文更新时间：2026-11-08T00:06:12.079Z
软件包许可：MIT

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

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

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

- 包体积（解压后）：2.5 MB，78 个文件
- 模块格式：ES Module
- TypeScript 类型：包内自带
- Node.js 要求：^24\.18\.0 \|\| \>=26\.0\.0
- 运行依赖：10 个
- peer 依赖：react ^18\.0\.0 \|\| ^19\.0\.0，react-dom ^18\.0\.0 \|\| ^19\.0\.0，@types/react ^18\.0\.0 \|\| ^19\.0\.0
- 首次发布：2026-04-04T01:13:21.323Z
- 最新版本发布：2026-11-05T23:00:38.724Z
- 近 30 天下载量：1965（2026-10-08 至 2026-11-06，npm 官方下载统计）
- 已发布版本数：36（近 12 个月 36 个）

## 中文简介

DocBlocks 的反应组件——文件探索器、工作空间拾取器和编辑器外壳

## 安装

```sh
npm install @bendyline/docblocks-react
```

也可以使用：`pnpm add @bendyline/docblocks-react`、`yarn add @bendyline/docblocks-react`、`bun add @bendyline/docblocks-react`

## README

# @ bendyline/ docblocks- react 页面存档备份,存于互联网档案馆

DocBlocks的回放组件——完整的编辑器 shell(文件探索器,工作空间拾取器,app菜单,导出管道)外加其从中构建的单个组件和钩子. 这是 DocBlocks 网络应用程序和桌面渲染器的软件包 .

## 安装

```bash
npm install @bendyline/docblocks-react react react-dom
npm install --save-dev @types/react @types/react-dom
```

**同伴依赖性 :** 反应出18或19. TypeScript 消费者必须安装 匹配 `@types/react` 主要(通常情况下) `@types/react-dom`; 反应类型 pal 是可选的,所以 JavaScript 仅限消费者不需要类型包 。 这个 DocBlocks 核心 (`@bendyline/docblocks`)和斯奎斯克编辑包是 常规依赖和自动安装.

## 使用量

```tsx
import { DocBlocksShell } from '@bendyline/docblocks-react';
import '@bendyline/docblocks-react/styles';

function App() {
  return <DocBlocksShell theme="auto" />;
}
```

视频出口工人使用模块块。 消费者必须保留 docBlocks 站点和桌面渲染器使用的相同工人设置 :

```ts
// vite.config.ts
import { defineConfig } from 'vite';

export default defineConfig({ worker: { format: 'es' } });
```

公式网格可以选择通过单独的IronCalc 引擎进入完整的 已建计算条目。 发布 `@ironcalc/wasm/wasm_bg.wasm` 以美元计 同一原产地的 URL 并保持厂房的模块范围 这样引擎仍然保留 懒惰且可重复使用 :

```tsx
import { createDocBlocksCalcEngineFactory } from '@bendyline/docblocks-react/calculation';

const calcEngineFactory = createDocBlocksCalcEngineFactory({
  wasmSource: '/ironcalc/wasm_bg.wasm',
});

function App() {
  return <DocBlocksShell calcEngineFactory={calcEngineFactory} />;
}
```

## 构成部分

### DocBlocks谢尔

Cononical DocBlocks体验在一个组件——文件探索者,工作空间取取者,应用菜单,斯奎斯克编辑器及其编辑器/Markdown / Play视图,以及导出管道.

```tsx
<DocBlocksShell theme="auto" logoUrl="/logo.png" />
```

-   `theme` —— 说 `'light' | 'dark' | 'auto'` (自定义如下) `prefers-color-scheme`(中文(简体) )
-   `logoUrl` ——应用菜单按钮的品牌标记
-   `calcEngineFactory` — 可选懒惰计算后端; 使用上面的计算切入点启用 IronCalc 公式
-   `ffmpegWasm` ——可选的同源 ffmpeg 核心 URL;提供它们可以使内置的动画GIF流在跨源同源主机上. **没有第一方水面供应这个.** 这个 `@ffmpeg/core` WebAssembly building is GPL-2.0-or-later,无法与苹果的 App Store 条款相协调,因此从每个 DocBlocks 发行中被移除. 给带自己编码器的主机的道具
-   `showCodeCopyButton` ——在普通被栅栏设置的代码块上显示复制控制(默认: `true`;美人鱼围栏仍为图表)
-   `onCopyCode` — 本地主机的可选剪贴板适配器;浏览器主机倒回 `navigator.clipboard.writeText`

存储在字节授权后抽象 `FileSystemProviderV2` 合同来源 `@bendyline/docblocks/filesystem`:浏览器-本地(IndexedDB),本地文件夹(File System Access API),瞬间内存工作空间,或Electron主机. 内置相容外观显示为 `provider.v2`; 第一方 shell 和文件树操作为 v2- 第一位.

### 文件爆炸器 / 文件端点

文件树浏览器内含创建(文件+文件夹),重命名并删除. 它跟随文件系统 当浏览器表面恢复时,自动监视事件并重新读取可见树. 长 名字轻而易举.

### 工作空间选择器

工作空间间切换的下拉,创建了新的,并打开了本地文件夹,加上每个工作空间设置对话框(重命名,下载,删除,版本历史覆盖).

### AppMenu 软件

左上方带有全应用软件的品牌菜单 **设置** 对话框(主题首选,全局版本-历史默认),可选“备份所有工作空间”,一个帮助组(键盘快捷键,文档),以及 **关于** 对话.

### 导出工具栏控制/ 导出对话框

没有完整的外壳需要出口管道的消费者可以使用 公共、独立建设的切入点:

```ts
import {
  DEFAULT_OPTIONS,
  ExportDialog,
  buildExportFilename,
  runExport,
} from '@bendyline/docblocks-react/export';
```

外壳也会溢出 **与嵌入的内容共享链接**它创造了 边框 `#shared(<base64>)` URL 包含一个压缩的, 仅由 Markdown 复制件 和可选初始使用模式。 打开 URL 只创建会话 工作空间; 生成的链接在 4,096 个字符后警告, 并封顶于 32,768个人物.

导出流:快速再导出最后一个配置外加全对话框——格式(PDF,Word,PowerPoint,EPUB,HTML,Markdown),可视化主题,和页面大小. 视频导出在WebCodecs所在之处,并使用麻省理工学院的许可证 `mp4-muxer`. 供应的宿主 `ffmpegWasm` 附加曝光动画 GIF 有时间、方向、标题、循环和色彩控制;没有第一当事方的表面。 动画GIF仍然可以从CLI和MCP获得,它们使用一个系统FFmpeg 二进制而不是分布式.

渲染出HTML和HTML ZIP导出包括普通被栅栏所设置的代码块的复制控制;美人鱼栅栏仍然是图.

## 钩子

### `useDocumentSession(delay?)`

对已修订内容具有约束力的反应 `DocumentSession`积极文档写道, 过渡、冲突和密切准备必须贯穿本届会议; 故意没有独立的自动救生钩.

### `useFileTree(provider)`

文件树状态管理覆盖任何 v2- 能力提供者 —— 返回树, 选择, 和明确的创建/ 移动/ remove 函数, 由外部提供者临时 v1 倒置 .

## 样式

```ts
import '@bendyline/docblocks-react/styles';
```

一个清晰的样式表导入覆盖了 Squisq 编辑器和全部 DocBlocks 组件 主题。 主题字体由主机应用程序提供;此软件包不捆绑字体.

## 新UI属于何处

居住在外壳铬(文件树、工作空间拾取器、应用菜单、导出对话框)内的跨地表UI属于这里。 VS代码扩展是故意的例外——它的网页视图上挂着斯奎斯克的 `EditorShell` 直接因为VS代码提供了文件探索器,工作空间,以及主题本身.

## 许可证

麻省理工学院

## 常见问题

### @bendyline/docblocks-react 是什么？

DocBlocks 的反应组件——文件探索器、工作空间拾取器和编辑器外壳

### 如何安装 @bendyline/docblocks-react？

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

### @bendyline/docblocks-react 支持 TypeScript 吗？

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

### @bendyline/docblocks-react 支持 ESM 还是 CommonJS？

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

### @bendyline/docblocks-react 需要什么版本的 Node\.js？

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

### @bendyline/docblocks-react 可以商用吗？

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

### @bendyline/docblocks-react 的下载量有多少？

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

### @bendyline/docblocks-react 还在维护吗？

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