# @aparte/plugin-mermaid 中文文档

规范地址：https://npmcn.com/package/%40aparte/plugin-mermaid/

版本：1\.0\.0
npm 元数据更新时间：2026-11-07T09:14:18.174Z
中文译文更新时间：2026-11-07T21:32:48.423Z
软件包许可：MIT

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

原始 npm 页面：https://www.npmjs.com/package/%40aparte/plugin-mermaid
原文对照：https://npmcn.com/package/%40aparte/plugin-mermaid/?lang=original
项目主页：https://apartejs.dev/guides/diagrams/
源码仓库：https://github.com/apartejs/aparte

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

- 包体积（解压后）：75.4 kB，13 个文件
- 模块格式：ES Module
- TypeScript 类型：包内自带
- Node.js 要求：\>=18
- 运行依赖：0 个
- peer 依赖：mermaid ^11\.16\.1，@aparte/core \>=1\.0\.0 \<2\.0\.0
- 首次发布：2026-10-28T19:07:14.447Z
- 最新版本发布：2026-11-07T09:14:17.786Z
- 近 30 天下载量：2410（2026-10-06 至 2026-11-04，npm 官方下载统计）
- 已发布版本数：15（近 12 个月 15 个）

## 中文简介

通过"人鱼"(Mermaid)取出分道扬镳的图表——以一幅被沙盒取出的形象取出为栅栏溪流.

## 安装

```sh
npm install @aparte/plugin-mermaid
```

也可以使用：`pnpm add @aparte/plugin-mermaid`、`yarn add @aparte/plugin-mermaid`、`bun add @aparte/plugin-mermaid`

## README

# @aparte/plugin-美人鱼

图表 [独立](https://github.com/apartejs/aparte) 通过 [美人鱼](https://mermaid.js.org/)。 。 。 . 每个 ` ```mermaid ` 答题中的栅栏被画成一个图表——它流出,以 安装了 Markdown 提供者, 或者没有 .

![A Mermaid flowchart drawn from a fence, in an aparté chat](https://apartejs.dev/shots/mermaid.png)

```bash
npm install @aparte/plugin-mermaid @aparte/core mermaid
```

```ts
import { setupMermaid } from '@aparte/plugin-mermaid';

setupMermaid();
```

`@aparte/core` 财务报告和审定财务报表 `mermaid` (11.16.1或后期)为 **同行依赖关系**。美人鱼装入 第一张图,不是之前的, 和一张图只有在它靠近屏幕时才被绘制,所以 打开长话短说.

## 一个图像,所以它里没有任何东西 可以在页面上行动

每个图表都是 `<img>` (原始内容存档于2019-10-21) (英语). Official website 浏览器绘制一个图像的 SVG 没有脚本也没有 访问页面,因此,一个模型所写的标签和图中的样式都无法运行 围绕它聊天。 美人鱼也跟着跑 `securityLevel: 'strict'` 关闭 HTML 标签,并 a 图表本身 `%%{init}%%` 无法恢复.

美人鱼画在图像存在之前, 在页面中, 以及那里获取的图表名称 那一刻。 三事名为相. 节点或演员自己的: `A@{ shape: imageSquare, img: "https://…" }` 或序列图 `properties A: {"icon": "https://…"}` 将会向该地址发出一个请求,所以 插件询问美人鱼解析到什么, 并询问一个不内含图片的图表 (单位:千美元)`data:image/…`虽然来源作了拼写,但没有绘制。 标签美人鱼写作 HTML 偶数 关闭 HTML 标签, 例如架构服务的图标文本: 它通过美人鱼自己的 禁止图片、玩家、帧和样式的消毒剂 `%%{init}%%` 无法升起。 一个风格: `classDef c mask-image:url(https://…)` 在一个状态或块图中,一旦测量到该图就立即取出,所以一个源有 CSS `url(`, (中文(简体) ), `image-set(` 或者说 `cross-fade(` (或一个 `@import`)不是被画出,也不是被画出 某种东西,并持有回击 逃脱,这可以拼出一个。 未绘制的图表显示其 来源和无法绘制的注释。 无法询问的美人鱼对象 所诠释之事`setupMermaidWith` ) 回到只拒绝文本的状态 拒绝在图中标出“ img” 的标签, 并带有形状数据和使用单词的序列图 `properties` 或者说 `details`。 。 。 .

成本:无法选择图中的文本,它被设置在系统字体中, 由于图像无法装入页面。 所绘制的图表保存着它的代码卡,所以复制按钮复制了它的出处.

## 当一个回复流

该图是随着栅栏的到来重新绘制的——最多每300米,或只要最后的 画取了——并保留了最后一个解析的版本. 一旦栅栏关闭,一个图表 不分析注释及其来源.

## 聊天的颜色

图表取自聊天主题的颜色( T)`--aparte-bg`, (中文(简体) ), `--aparte-text`, (中文(简体) ), `--aparte-primary`),当主题改变时再次被绘制. 它的替代文字是图自己的 `accTitle` 或者说 `accDescr`,其他“数字”;设置 `diagramAlt` 财务报告和审定财务报表 `diagramError` 与 `extendLocale()` 来翻译倒数和错误注释.

## 选项

`setupMermaid(options?, config?)` 带 `MermaidOptions`数字 :

| 选项 | 默认 |  |
| --- | --- | --- |
| `progressive` | `true` | `false` 栅栏关闭后绘制图 |
| `mermaid` | `{}` | 美人鱼自己的配置:a `flowchart` 曲线, `themeVariables`. |

## 两个切入点

`@aparte/plugin-mermaid` 在第一个图表中输入人鱼。 把它交给自己,使用 输入的条目 `mermaid`数字 :

```ts
import mermaid from 'mermaid';
import { setupMermaidWith } from '@aparte/plugin-mermaid/core';

setupMermaidWith(mermaid);
```

`setupMermaidWith` 以实例为例,或函数返回承诺,以及任何对象 形状像 `MermaidLike` (单位:千美元)`initialize`, (中文(简体) ), `parse`, (中文(简体) ), `render`) (中文(简体) ). 这两个功能都返回了处置者.

美人鱼为整页保留一个配置,插件调用 `initialize` 联合国 在它绘制的每一幅图之前拥有它。 如果您的页面还绘制了相同的图表 美人鱼,呼叫 `mermaid.initialize(yourConfig)` 在你之前 `render()` 或者说 `run()`。 。 。 .

仅限无害环境管理.

## 常见问题

### @aparte/plugin-mermaid 是什么？

通过"人鱼"\(Mermaid\)取出分道扬镳的图表——以一幅被沙盒取出的形象取出为栅栏溪流\.

### 如何安装 @aparte/plugin-mermaid？

在项目目录运行 npm install @aparte/plugin-mermaid，或使用 pnpm add / yarn add / bun add。它还需要宿主项目提供 peer 依赖：mermaid（^11\.16\.1）、@aparte/core（\>=1\.0\.0 \<2\.0\.0）。npm 7 及以上与 pnpm 8 及以上默认会自动安装必需的 peer 依赖，Yarn 需要手动安装。

### @aparte/plugin-mermaid 支持 TypeScript 吗？

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

### @aparte/plugin-mermaid 支持 ESM 还是 CommonJS？

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

### @aparte/plugin-mermaid 需要什么版本的 Node\.js？

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

### @aparte/plugin-mermaid 可以商用吗？

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

### @aparte/plugin-mermaid 的下载量有多少？

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

### @aparte/plugin-mermaid 还在维护吗？

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