@ boneskull/ typedoc- plugin- 美人鱼
用于渲染美人鱼图的 TypeDoc 插件
此插件将您类型Doc 文档中的美人鱼代码块转换为 绘制出图表。 它会自动适应TypeDoc的光和暗的主题.
特征
- 栅栏码块的美人鱼图
- 基于 TypeDoc 主题的 暗/ 淡主题自动切换
- 当 JavaScript 被禁用时, Graceful 回落到普通代码
- 从CDN或本地装入美人鱼
node_modules - 响应图大小
安装
npm install @boneskull/typedoc-plugin-mermaid -D
使用量
将插件添加到您的 typedoc.json数字 :
{
"ignoredHighlightLanguages": ["mermaid"],
"plugin": ["@boneskull/typedoc-plugin-mermaid"]
}
这个 ignoredHighlightLanguages 选项沉默类型Doc警告 mermaid
不被识别为突出显示语言( 此插件单独处理) .
或者通过命令行 :
typedoc --plugin @boneskull/typedoc-plugin-mermaid
然后在文档注释中使用美人鱼代码块 :
/**
* Represents a workflow state machine.
*
* ```mermaid
* stateDiagram-v2
* [*] --> Idle
* Idle --> Processing: start()
* Processing --> Complete: finish()
* Processing --> Error: fail()
* Complete --> [*]
* Error --> Idle: retry()
* ```
*/
export class Workflow {
// ...
}
支持的图表类型
美人鱼作品支持的任何图表类型:
- 流程图
- 序列图
- 类图
- 状态图
- 实体关系图
- 甘特图
- 拼图
- 还有...
见 美人鱼文档 用于所有图表 类型和语法.
配置
mermaidSource
从哪里装入美人鱼图书馆. 默认为 "cdn"。 。 。 .
| 数值 | 说明 |
|---|---|
"cdn" | 从 CDN URL 中装入(通过 mermaidCdnUrl(中文(简体) ) |
"local" | 复制美人鱼的无害环境管理包 node_modules 到文件输出 |
类型doc.json :
{
"mermaidSource": "local"
}
使用时 "local",您必须在您的项目中安装美人鱼:
npm install mermaid -D
插件复制美人鱼的无害环境管理切入点并块目录到
assets/mermaid/ 在文档输出中。 图表专用代码被懒惰地装入
需求,所以只有您实际使用的图表类型被浏览器下载.
使用 "local" 需要时:
- 离线文档
- 空载或受限制的网络环境
- 绑定的美人鱼版本与您的文档捆绑
- 全面控制美人鱼分布
mermaidCdnUrl
装入美人鱼库的 URL 。 默认为
https://unpkg.com/mermaid@latest/dist/mermaid.esm.min.mjs。 。 。 .
仅在 mermaidSource 实值 "cdn" (默认).
这对使用替代的CDN或自宿库有用.
类型doc.json :
{
"mermaidCdnUrl": "https://cdn.jsdelivr.net/npm/mermaid@11/dist/mermaid.esm.min.mjs"
}
命令行 :
typedoc --mermaidCdnUrl "https://your-cdn.example.com/mermaid.esm.min.mjs"
如何运作
插件钩入了TypeDoc的 HTML 渲染管道并:
- 查找
<pre><code class="mermaid">输出中的块 - 装入装有暗色和浅色标本的容器
- 输入 CSS 和 JavaScript 来渲染图表和切换主题
- 保留原始代码作为非 JS 环境的倒置
图表是使用美人鱼库制作的客户端, 无论是来自
cDN 或文档输出中的本地副本(取决于 mermaidSource) (中文(简体) ).
承认
此插件是从 类型doc- 插件- 人工智能 以 卡米亚扎。 。 。 .
与原文的区别
| 特性 | 此插件 | kamiazya/型多克-插素-美人鱼 |
|---|---|---|
| 类型文件版本 | 0.27+ (中文(简体) ) | 0.22-0.26 (中文(简体) ) |
| 制定战略 | 带有 CSS 切换的双向暗光图 | 每个区块的单图 |
| 主题支持 | 基于 TypeDoc 主题的自动暗光/ 灯光 | 手动主题配置 |
@mermaid JSDoc 标签 | 不予支持 | 支助 |
| 美人鱼加载 | CDN 或带有懒散块的本地无害环境管理包 | 包装 UMD 或 CDN |
| 离线支持 | 是(与 mermaidSource: "local"(中文(简体) ) | 是(捆绑时) |
| 配置选项 | mermaidSource, (中文(简体) ), mermaidCdnUrl | mermaidVersion, (中文(简体) ), mermaidCdn |
为什么是新插件?
原插件因中断API而停止与 TypeDoc 0.27+ 工作 更改和似乎未保留.
许可证
版权 2026 克里斯托弗·"波内斯库尔"·希勒获得许可 蓝橡-1.0.0。 。 。 .