mermaid-ascii终极指南:如何在终端里直接渲染Mermaid图表,一次上手
mermaid-ascii终极指南如何在终端里直接渲染Mermaid图表一次上手【免费下载链接】mermaid-asciiRender Mermaid graphs inside your terminal项目地址: https://gitcode.com/GitHub_Trending/me/mermaid-asciimermaid-ascii 是一个用 Go 编写的开源命令行工具可以在终端里直接渲染 Mermaid 图表把流程图、序列图、ER 图转成纯文本 ASCII 图形无需浏览器、无需 Node.js 运行时一条命令即可让 Mermaid 代码变成能复制、能进日志、能进 README的字符画。 mermaid-ascii 是什么平时写文档Mermaid 语法往往要依赖网页渲染器才能看到效果。而 mermaid-ascii 的思路是在纯文本终端里还原图表。它的核心能力包括流程图 / Graph支持graph LR、graph TD、带标签的边、A B多分支、彩色节点序列图 / Sequence消息箭头、loop / opt / alt / par 等分组块、自消息、备注NoteER 图 / Entity Relationship实体属性表 鸦脚crows-foot基数连接线Unicode / 纯 ASCII 双模式终端支持就画┌─┐不支持就降级为--Web 交互界面内置 HTTP 服务边写边渲染项目入口在 main.go 和cmd/目录三种图表由cmd/diagram.go中的工厂自动识别分发分别由pkg/graph渲染逻辑、pkg/sequence/和pkg/er/两套解析器实现。如何快速安装 mermaid-ascii方法一克隆源码编译最简单项目提供Dockerfile、flake.nix、Makefile和 PKGBUILD 多种构建方式源码构建只需 Go 环境git clone https://gitcode.com/GitHub_Trending/me/mermaid-ascii cd mermaid-ascii go build ./mermaid-ascii --help也可以使用 Nix 一键构建cd mermaid-ascii nix build ./result/bin/mermaid-ascii --help方法二Docker 运行构建文件见项目根目录的Dockerfile基于 Alpine镜像非常小docker build -t mermaid-ascii . echo graph LR A--B--C | docker run -i mermaid-ascii -f -第一次渲染终端里的 Mermaid 流程图新建一个test.mermaid文件然后用-f指定文件渲染$ cat test.mermaid graph LR A -- B C B -- C D D -- C $ mermaid-ascii -f test.mermaid ┌───┐ ┌───┐ ┌───┐ │ │ │ │ │ │ │ A ├────►│ B ├────►│ D │ │ │ │ │ │ │ └─┬─┘ └─┬─┘ └─┬─┘ │ │ │ │ ▼ │ │ ┌───┐ │ └──────►│ C │◄──────┘ └───┘除了文件参数它还支持从标准输入读取方便管道处理cat test.mermaid | mermaid-ascii echo graph LR A--B--C | mermaid-ascii一键调优布局常用参数速查渲染效果不满意用几个参数即可微调参数定义见cmd/root.go参数作用默认值-x, --paddingX节点之间的水平间距5-y, --paddingY节点之间的垂直间距5-p, --borderPadding文字与边框的内边距1--ascii关闭扩展字符只输出纯 ASCII关--coords显示网格坐标调试布局用关# 拉大水平间距箭头更舒展 mermaid-ascii -f test.mermaid -x 8 # 老终端/日志系统显示乱码强制纯 ASCII 模式 cat test.mermaid | mermaid-ascii --ascii --- --- --- | | | | | | | A |----| B |----| D | --- --- ---在终端里画 Mermaid 序列图序列图是它的强项消息流、分组块、自消息都能还原解析与渲染逻辑位于pkg/sequence/$ cat sequence.mermaid sequenceDiagram Alice-Bob: Hello! Bob-Charlie: Forward message Charlie--Alice: Got it!渲染后是三条生命线加箭头┌───────┐ ┌─────┐ ┌─────────┐ │ Alice │ │ Bob │ │ Charlie │ └───┬───┘ └───┬──┘ └────┬────┘ │ Hello! │ │ ├───────────►│ │ │ Forward message │ │ ├─────────────►│ │ Got it! │ │◄┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┤已支持的序列图语法相当完整实线 / 虚线 / 交叉 / 异步 / 双向箭头、loop、opt、alt/else、par/and、critical、break、rect分组块可嵌套、autonumber自动编号、Note over/left of/right of备注、participant A as Alice别名、自消息A-A、含空格或短横线的参与者名甚至 emoji 与中日韩字符也能正确对齐。在终端里画 Mermaid ER 图ER 图会把实体渲染成带类型、名称、主外键的属性表格关系用鸦脚符号连接且每条关系独占一条路由通道标签永不打架$ cat er.mermaid erDiagram CUSTOMER ||--o{ ORDER : places ORDER ||--|{ LINE_ITEM : contains CUSTOMER }|..|{ DELIVERY_ADDRESS : uses┌──────────┐ ┌───────┐ │ CUSTOMER │ │ ORDER │ └───┬───┬──┘ └───┬───┬┘ └||─┼──────places─────────o{┘ │ ┌}|────────contains────────||┘ │└}|┈┈┈┈┈┈┈┈┈┈┈uses┈┈┈┈┈┈┈┈┈┈|{┐ ┌──────┴────┐ ┌─────────┴────────┐ │ LINE_ITEM │ │ DELIVERY_ADDRESS │ └───────────┘ └──────────────────┘全部鸦脚基数||--o{、}|..|{等、数字形式1、0、1和文字形式only one、zero or more…都支持识别关系画实线非识别关系画虚线。实体还可以写属性块string name PK、使用别名和自关联。解析器位于pkg/er/测试用例覆盖了上百种基数组合见cmd/testdata/er/。 Web 交互界面边写边渲染不想反复保存文件mermaid-ascii 内置了一个 HTTP 服务实现见cmd/web.go页面模板在templates/index.tmpl、static/script.jsmermaid-ascii web启动后在浏览器打开本机3001端口即可在网页里粘贴 Mermaid 代码、调整间距和 ASCII/Unicode 开关实时看到终端效果。服务端还带结果缓存上限 10000 条重复输入秒出。Docker 场景下一条命令即可暴露服务docker run -p 3001:3001 mermaid-ascii web目前支持的 Mermaid 语法清单图表类型✅ 已支持⏳ 暂不支持流程图LR/TD 方向、带标签的边、一行多箭头、A B、classDef彩色、防箭头压节点subgraph、非矩形节点、斜向箭头序列图多种箭头、自消息、别名、Note、loop/opt/alt/par/critical/break/rect、autonumber、Unicode激活框activate/deactivateER 图全部鸦脚基数、数字/文字基数、识别/非识别关系、属性表PK/FK/UK/注释、别名、自关联u--MD_PARENT、style 样式指令 它是怎么工作的原理并不复杂分三步解析把 Mermaid 代码解析成节点、边和消息等基础组件网格映射每个节点分配若干网格点节点之间留一条通道边在网格点上规划路径绘制把路径转成字符画并保证箭头不会穿过节点。想亲眼看看网格布局可以打开--coords参数图上会标出每个网格点的位置——这也是理解它布局算法的最快方式。核心渲染管线分散在cmd/parse.go、cmd/graph.go、cmd/draw.go、cmd/render.go等文件中测试用例cmd/testdata/下数百个 txt 期望输出几乎覆盖了所有边界情况。❓ 新手常见问题Q需要安装 Node.js 或 Mermaid 官方运行时吗不需要。mermaid-ascii 是纯 Go 原生解析和渲染离线可用无需任何外部服务。Q终端里显示乱码、方框错位怎么办加--ascii开关强制输出纯 ASCII 字符--风格任何终端都能正确显示。Q能输出彩色图表吗可以。只要终端支持颜色用classDef example color:#ff0000节点:::example的写法即可让节点着色。Q和网页版 Mermaid 渲染器比有什么优势结果是纯文本可以直接粘进终端输出、CI 日志、纯文本邮件和 README还能用-x/-y/-p精确控制间距这是图片式渲染器做不到的。从go build到第一次渲染整个过程不超过一分钟。把 mermaid-ascii 加进 PATH 后你的每一段 Mermaid 代码都会立刻在终端里活过来。【免费下载链接】mermaid-asciiRender Mermaid graphs inside your terminal项目地址: https://gitcode.com/GitHub_Trending/me/mermaid-ascii创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考