markdown整合流程图和通用文档转换为word等格式，使用mermaid+pandoc

最近有画流程图和脑图的需求，同时word文档编辑没有vim模式，这两个常规工具都只能用鼠标操作，让人甚是心烦。之前都是用vscode http://draw.io插件去画图，虽然也算方便，但对我来说还是不够。于是这两天折腾了一下，整合了一套markdown画流程图（包括脑图等）再转换pdf或word的方法。毕竟工作过程中各角色协调还是少不了office软件，直接将markdown转换成word，可能不需要修改就可以直接用了。

准备工作

1. vscode或neovim（或其他支持markdown mermaid的编辑器）

vscode 需要拓展[Markdown All in One - Visual Studio Marketplace]和[Markdown Preview Mermaid Support - Visual Studio Marketplace]

neovim 需要[markdown-preview.nvim]

2. 安装[mermaid-filter]和[pandoc]，arch linux 直接yay -S即可, windows 可以用choco 或其他包管理器或官网下载安装pandoc, npm install -g mermaid-filter安装mermaid-filter各平台通用

vscode编辑markdown启用侧边预览即可看到效果，neovim执行:MarkdownPreview即在浏览器打开预览页，两者效果基本一样

上手尝试

编辑一个流程图(或者随便你需要的并且mermaid支持的流程图)，参考About Mermaid | Mermaid

这里给一个示例

```mermaid
    flowchart
    A-->B
```

编辑器里可以即时看到效果，知乎识别不了mermaid语法

这样在演示时其实就够用了，奈何得照顾非技术同学，对吧。于是pandoc出场：

假设文件名为test.md，我们转换为test.docx，在test.md目录打开shell，执行：

pandoc -t docx -o test.docx -F mermaid-filter test.md

-t type 转换的文件类型

-o output 输出的文件名称

-F --filter的简写，指定mermaid-filter将代码转换为图片，windows下是mermaid-filter.cmd

最后的参数是源文件名称

打开test.docx

大功告成~

呃，默认导出的字体粗体在linux wps下看起来好奇怪，有些markdown链接也没识别，乐观一点，问题不大 😃

如果未安装 Chrome，需要使用环境变量CHROME_EXECUTABLE将其值设置为C:\Program Files (x86)\Microsoft\Edge\Application\msedge.exe。