朝花夕拾

A Development Engineer, a Life Liver, a Hope Holder

日常开发中经常会绘制一些流程图,类图。在各种绘图工具中,我用的比较多的是PlanUML。因为这个组件不用额外安装软件,直接按照标准语法在自己的文档中编码,PlanUML解析服务就会自动在自己的文档中绘制UML图,并且几乎大部分在线文档平台都支持PlanUML插件了,所以使用成本非常小,非常方便。那么如何在Hexo中使用PlanUML绘制图形呢?

添加插件

具体如何实现?一般来说,对于这种场景的工具,Hexo应该已经有现成的插件了。于是我上hexo官网找了下,果然发现了可用的插件。
image

安装方式:
npm install --save hexo-filter-plantuml
使用方式:

绘制UML

官方的使用方式如下:
image
不过很不幸,这种方式planUML服务器总是提示解析失败
具体效果如下:

后来查了一些资料,发现通过下面语法可以正常渲染
image
渲染效果如下:

绘一个简单的流程图:
数据查询场景,用户请求从客户端过来,先经过网关,对用户信息进行统一鉴权。然后网关将请求转发到后端数据服务。数据服务做完参数校验后,将数据返回给客户端。