技术文章有时会用到各种图形。一般来说，你可以画好图，把截图放在文章里。虽然图片本身也是很小的，但是放很多图片又不占地方，也不是很好。mermaid美人鱼官网美人鱼支持多种图形渲染，使用它是不错的选择。它可以渲染各种复杂的图形。比如下面这一张。sequenceDiagramparAlicetoBobAlice->>Bob:GohelpJohnandAlicetoJohnAlice->>John:IwantthisdonetodayparJohntoCharlieJohn->>Charlie:我们今天能做吗？约翰对戴安娜约翰->>戴安娜：你今天能帮我们吗？endend只需要几行代码就可以画出它sequenceDiagramparAlicetoBobAlice->>Bob:GohelpJohnandAlicetoJohnAlice->>John:IwantthisdonetodayparJohntoCharlieJohn->>查理：我们今天可以这样做吗？约翰对戴安娜约翰->>戴安娜：你今天能帮我们吗？endend安装步骤很简单，只需要三步就可以安装hexo插件npmihexo-filter-mermaid-diagrams配置hexo#mermaidchartmermaid:##mermaidurlhttps://github.com/knsv/mermaidenable:true#defaulttrueversion:"8.13.8"#defaultv7.1.2options:#从https://github.com/knsv/mermaid/blob/master/src/mermaidAPI找到更多api选项。js#startOnload:true//默认true主题配置进入你项目文件中的themes\stun\layout\_partials\footer\footer.pug文件。我使用的主题使用的是pug语言，所以可以加上这行代码script(src="https://cdn.bootcdn.net/ajax/libs/mermaid/8.13.8/mermaid.min.js")如果是以.swig结尾的主题页面文件，可以参考如下配置{%iftheme.mermaid.enable%}{%endif%}如果是原生js就更简单了，插入这行代码即可参考与推荐【hexo攻略】在hexo中运行shader和threejs【hexo攻略】hexo配合github动作自动构建（多种形式）【hexo攻略】hexo发布内容到gitee页面【hexo指南]hexo发布内容到多个git仓库[hexo指南]hexo发布内容到多个git仓库
