vscode 实时预览 markdown

    vscode 默认就支持 markdown 文件预览，无需安装任何插件，先来张效果图

可以看到直接在vscode编辑器中直接就可以看到效果，而且无需安装任何插件，操作也十分简单如下：

    在编辑markdown文件页

     control（mac中按command） + k 然后按 v 就可以像效果图一样，在右侧打开一个新的窗口用来实时预览markdown文件了

（1）绘制流程图(flow chart)

```flow

//定义类型和描述

st=>start: 开始

e=>end: 结束

op=>operation: 我的操作

cond=>condition: 判断确认？

st->op->cond

cond(yes)->e

cond(no)->op

```

流程图如下：

 

对账流程

```flow

st=>start: 开始

e=>end: 结束

op=>operation: 获取文件

op1=>operation: 解析文件

op2=>operation: 对账处理

op3=>operation: 失败

cond1=>condition: 连接成功or失败

cond2=>condition: 重试<3

io1=>inputoutput: 差错文件导出（统计结果、文件）

st->op->cond1

cond1(yes)->op1->op2->io1->e

cond1(no)->cond2

cond2(yes)->op

cond2(no,down)->op3->e

```

对账流程图如下：

（2）绘制时序图(顺序图)

```sequence

chaochao-> yuyu: good morning

note left of chaochao: man

yuyu -> chaochao: eat something

note right of yuyu: woman

note over chaochao: lucky

```

时序图如下：

微信通讯时序图：

```sequence

微信用户-> 微信服务器:1:微信消息/事件

微信服务器-> 开发者服务器:2:推送消息/事件

开发者服务器-> WxBase:3:消息/事件处理准备

WxBase->WxHandler:4:分析并处理消息/事件

WxHandler->XmlMsgBuilder:5:传递回复消息实体

XmlMsgBuilder->WxBase:6:生成XML格式消息

WxBase->开发者服务器:7:输出回复消息

开发者服务器->微信服务器:8：响应推送

微信服务器->微信用户:9:用户接收回复

```

时序图如下：

 

最后按下图的按钮可以预览