流程图
Mr.Hope ... 2021-2-25 小于 1 分钟
让你的 VuePress 站点中的 Markdown 文件支持流程图。
本插件利用了 flowchart.js (opens new window) 来支持这一功能。
# 配置
module.exports = {
themeConfig: {
mdEnhance: {
flowchart: true,
},
},
};
1
2
3
4
5
6
7
2
3
4
5
6
7
# 语法
<!-- ↓ :preset 是可选的 -->
```flow:preset
<!-- 放置你的流程图代码 -->
```
1
2
3
4
5
6
7
2
3
4
5
6
7
目前可用的预设:
vue(默认)ant
# 演示
```flow
st=>start: Start|past:>http://www.google.com[blank]
e=>end: End|future:>http://www.google.com
op1=>operation: My Operation|past
op2=>operation: Do something|current
sub1=>subroutine: My Subroutine|invalid
cond=>condition: Yes
or No?|approved:>http://www.google.com
c2=>condition: Good idea|rejected
io=>inputoutput: catch something...|future
st->op1(right)->cond
cond(yes, right)->c2
cond(no)->sub1(left)->op1
c2(yes)->io->e
c2(no)->op2->e
```
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17