# fluxdown 中文文档

规范地址：https://npmcn.com/package/fluxdown/

版本：0\.14\.3
npm 元数据更新时间：2026-11-03T16:09:54.820Z
中文译文更新时间：2026-11-03T19:30:11.307Z
软件包许可：MIT

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

原始 npm 页面：https://www.npmjs.com/package/fluxdown
原文对照：https://npmcn.com/package/fluxdown/?lang=original
项目主页：https://fluxdown.dev/guide/react/quick-start.html
源码仓库：https://github.com/hexmora/fluxdown

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

- 包体积（解压后）：105 kB，98 个文件
- 模块格式：ESM + CJS
- TypeScript 类型：包内自带
- Node.js 要求：\>=22\.18\.0
- 运行依赖：7 个
- peer 依赖：react ^18\.0\.0 \|\| ^19\.0\.0，react-dom ^18\.0\.0 \|\| ^19\.0\.0
- 首次发布：2026-09-13T19:16:57.231Z
- 最新版本发布：2026-11-03T16:09:54.490Z
- 已发布版本数：25（近 12 个月 25 个）

## 中文简介

用于React AI聊天的流式Markdown渲染器，具有语法修复，平滑输出和可定制组件。

## 安装

```sh
npm install fluxdown
```

也可以使用：`pnpm add fluxdown`、`yarn add fluxdown`、`bun add fluxdown`

## README

# React的Fluxdown

流式Markdown，为React应用准备好了。

`fluxdown` 呈现包含基本样式、代码高亮显示和复制按钮的Markdown。它支持GFM表、任务列表、删除和自动链接。在生成过程中，它可以平滑输入的文本，修复未完成的语法，并淡入尾随字符。

[文档](https://npmcn.com/website/docs/en/guide/react/quick-start.md) · [操场上](https://fluxdown.dev/playground.html) · [简体中文](https://npmcn.com/package/fluxdown/docs/README.zh-CN.md)

## 安装

在React 18或19应用中：

```sh
pnpm add fluxdown
```

## 呈现消息

```tsx
import { Fluxdown } from "fluxdown";

type MessageProps = {
  text: string;
  isStreaming: boolean;
};

export function Message({ text, isStreaming }: MessageProps) {
  return <Fluxdown text={text} streaming={isStreaming} />;
}
```

通过 **到目前为止收到了完整的消息** 作为 `text`，如有必要，在请求处理程序中积累块。集 `isStreaming` 来 `false` 请求完成、取消或失败时。Fluxdown然后显示所有接收到的文本并停止其流效果。你的应用程序处理请求、取消和错误。

对于静态Markdown，使用 `<Fluxdown text={text} />`． 在消息列表中，为每个组件提供一个稳定的消息ID作为其 `key`。

如果你的打包器不自动加载这些样式，把下面的添加到你的应用的全局样式条目中：

```ts
import "fluxdown/styles.css";
```

## 让它成为你自己的

| 选项 | 目的 |
| --- | --- |
| `streaming` | 配置尾随语法修复、平滑输出和可选的视觉效果。 |
| `theme` | 使用浅色或深色预设，或覆盖颜色、排版和间距。 |
| `build` | 启用语法，如公式和脚注。 |
| `plugins` | 自定义解析、呈现、语义槽和交互。 |
| `className`， `style` | 设置容器布局和样式。 |

`streaming={true}` 允许拖尾修复和平滑输出。添加一个可选的视觉效果：

```tsx
<Fluxdown text={text} streaming={isStreaming && { effect: "shad" }} />
```

## 文档

-   [快速启动](https://npmcn.com/website/docs/en/guide/react/quick-start.md)
-   [流媒体内容](https://npmcn.com/website/docs/en/guide/react/streaming.md)
-   [风格指南](https://npmcn.com/website/docs/en/guide/react/customization.md)
-   [配置](https://npmcn.com/website/docs/en/guide/react/configuration.md)
-   [使用和编写插件](https://npmcn.com/website/docs/en/guide/react/plugins.md)

有关React之外的自定义渲染器，请参见 [`@fluxdown/core`](https://npmcn.com/package/core)。

## 贡献与许可

看到 [CONTRIBUTING.md](https://npmcn.com/CONTRIBUTING.md)． 下许可 [麻省理工学院](https://npmcn.com/LICENSE)。

## 常见问题

### fluxdown 是什么？

用于React AI聊天的流式Markdown渲染器，具有语法修复，平滑输出和可定制组件。

### 如何安装 fluxdown？

在项目目录运行 npm install fluxdown，或使用 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 需要手动安装。

### fluxdown 支持 TypeScript 吗？

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

### fluxdown 支持 ESM 还是 CommonJS？

同时提供 ES Module 与 CommonJS 入口，import 和 require\(\) 都可以使用，打包工具会自动选择合适的版本。

### fluxdown 需要什么版本的 Node\.js？

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

### fluxdown 可以商用吗？

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

### fluxdown 还在维护吗？

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