养生 装修 购物 美食 感冒 便秘 营销 加盟 小吃 火锅 管理 创业 搭配 减肥 培训 旅游

vscode如何在markdown中支持mermaid流程图

时间:2024-11-07 13:47:51

本经验介绍在vscode中水貔藻疽,如何在markdown中支持mermaid流程图。在markdown中支持mermaid流程图绺从萦米可以安装markdownpreviewmermaidsupport插件。

vscode如何在markdown中支持mermaid流程图

工具/原料

vscode1.37.1

方法/步骤

1、首先,打开vscode,切换到插件面板,搜索mermaid。安装如图所示插件。

vscode如何在markdown中支持mermaid流程图

2、安装好mermaid插件之后,就可以在markdow中使用了。使用如图的mermaid代码块,图中是未安装插件时的预览。

vscode如何在markdown中支持mermaid流程图

3、安装插件之后的预览则发生变化,出现图像。

vscode如何在markdown中支持mermaid流程图

4、在mermaid代码块中,可以使用各种mermaid语法,比如可以调整形状样式。

vscode如何在markdown中支持mermaid流程图

5、也可以写classDiagram的代码,绘制类的关系图,如图所示。

vscode如何在markdown中支持mermaid流程图

6、或者,也可以绘制gantt图等。细节可以查阅mermaid的在线文档。

vscode如何在markdown中支持mermaid流程图

© 一点知识