安装最新的vscode编辑器,原生支持markdown语法。不会markdow的人可以去好好学下,写文档神器!!!

1、安装Markdown Preview Enhanced插件

2、本地新建test.md文件
输入:

```flow
st=>start: 页面加载
e=>end: End:>http://www.google.com
op1=>operation: get_hotel_ids|past
op2=>operation: get_proxy|current
sub1=>subroutine: get_proxy|current
op3=>operation: save_comment|current
op4=>operation: set_sentiment|current
op5=>operation: set_record|current

cond1=>condition: ids_remain空?
cond2=>condition: proxy_list空?
cond3=>condition: ids_got空?
cond4=>condition: 爬取成功??
cond5=>condition: ids_remain空?

io1=>inputoutput: ids-remain
io2=>inputoutput: proxy_list
io3=>inputoutput: ids-got

st->op1(right)->io1->cond1
cond1(yes)->sub1->io2->cond2
cond2(no)->op3
cond2(yes)->sub1
cond1(no)->op3->cond4
cond4(yes)->io3->cond3
cond4(no)->io1
cond3(no)->op4
cond3(yes, right)->cond5
cond5(yes)->op5
cond5(no)->cond3
op5->e

```

3、右键实时预览效果

就会看到下面的预览效果:

编辑器右键还可以将流程图存为html,图片,用浏览器打开等!

欢迎大家试用! 写好文档也是一项必备技能呦!

VS Code实现markdown画流程图的更多相关文章

  1. 使用mermain用Markdown的语法画流程图和UML图

    博客搬到了fresky.github.io - Dawei XU,请各位看官挪步.最新的一篇是:使用mermain用Markdown的语法画流程图和UML图.

  2. 使用 Markdown Flow 画流程图

    使用 Markdown Flow 画流程图 好处是可以方便的使用 Git 管理版本 st=>start: 开始 e=>end: 结束 c1=>condition: A c2=> ...

  3. MarkDown和流程图诠释你的代码

    写在前面:首先感谢导师-猴哥对我的认可(求多分享点编程经验.工具.多开课),学习编程是一个痛苦和快乐的过程,希望大家共勉 本文介绍MarkDown的基本语法.使用MarkDown画简单的流程图.使用X ...

  4. markdown的流程图实现和代码语法着色

    用flowchart为markdown添加流程图 举个例子如下,根据这个例子大家就能看懂我到底是怎么实现的 <!DOCTYPE html> <html> <head> ...

  5. 使用vs code编写Markdown文档以及markdown语法详解

    首先安装vscode工具,下载地址如下: https://code.visualstudio.com/ 在vs code的扩展中安装: Markdown Preview Enhanced 这款插件,安 ...

  6. [6278009]使用Visual Stuido Code 编写Markdown

    使用Visual Stuido Code 编写Markdown void main() { printf("Hello world!"); } void main() { Cons ...

  7. canvas画流程图

    用canvas画流程图: 需求:最后一个圆圈无直线 遇到问题:需要画多个圆圈时,画布超出显示屏加滚动条,解决方法是<canvas>外层<div>的width=100%,且ove ...

  8. activiti在线画流程图

    springboot2.2 activiti6.0 activiti-modeler 5.22.0 注明:版本不一样会导致报错 上一篇:springboot整合activiti 效果图 代码分享:ht ...

  9. flowable+tomcat部署flowable项目,在线画流程图

    参考: flowable+tomcat部署flowable项目,在线画流程图

随机推荐

  1. 虚拟机--python环境配置

    1.安装VMware 2.安装Ubantu (1)打开VMware,打开编辑-->首选项,更改虚拟机存储的位置. (2)创建新的虚拟机(自定义): (3)编辑虚拟机--点击CD/VCD--更改成 ...

  2. ArangoDB数据导入

    目录 arangoimp方法 参数解析 实例展示 python方法 单条导入 批量导入 1.arangoimp方法 参数解析 全局配置部分(Global configuration) --backsl ...

  3. github实用的搜索小技巧

    查资源,学习优秀的框架,搜索是一种能力! 作为程序猿开发中最大的同性交友网站,github当之无愧,里面有很多优秀的开源框架,各种技术大佬混迹其中,有他们总结的学习教程,造好的轮子(开发的各种工具,技 ...

  4. .NET Core 3.0 中间件 Middleware

    中间件官网文档解释:中间件是一种装配到应用管道以处理请求和响应的软件 每个中间件: 选择是否将请求传递到管道中的下一个组件. 可在管道中的下一个组件前后执行工作. 使用 IApplicationBui ...

  5. Linux性能分析

    生产环境服务器变慢,诊断思路和性能评估 整机:top 代码 public class JavaDemo2 { public static void main(String[] args) { whil ...

  6. 小白学 Python(16):基础数据类型(函数)(上)

    人生苦短,我选Python 前文传送门 小白学 Python(1):开篇 小白学 Python(2):基础数据类型(上) 小白学 Python(3):基础数据类型(下) 小白学 Python(4):变 ...

  7. 全排列函数(next_permutation())

    平常需要全排列的时候,一般都是dfs然后字符串匹配啥的……今天看题解的时候突然发现了这个神器. next_permutation()函数在c++的algorithm库里,作用是传入一个数组,输出这个数 ...

  8. 网络安全-主动信息收集篇第二章-二层网络扫描之Netdiscover

    专用于二层发现 可用于无限和交换网络环境 主动和被动探测 主动模式:netdiscover –i 网卡名 –r IP/网络位  /   netdiscover –l IPList.txt 被动 net ...

  9. 赤壁情:dp

    首先这道题用到的3个新关键字大概讲一下: (我刚学会仅仅会瞎搞做题,欢迎大神补充) static:声明一个变量并清空.(不知道用不用时间,求解答) 具体用法:static 变量类型 变量名.如:sta ...

  10. day3(数论)

    总得来说,这是可怕的一天,极其可怕的一天(完) 一.数论 阴影啊! 首先,设ab为两个整数,则存在唯一的q和r,使得a=qb+r 若r=0,则b整除a,记作b|a. (1)同余 若a/m和b/m的余数 ...