使用VSCode编辑Markdown+PlantUml

vscode :https://code.visualstudio.com/

什么是markdown:

Markdown 是一种轻量级标记语言,它允许人们使用易读易写的纯文本格式编写文档。

Markdown 编写的文档可以导出 HTML 、Word、图像、PDF、Epub 等多种格式的文档。

在vscode上安装MarkDown相关插件:

  • Markdown Preview Enhanced
  • Markdown All io One

什么是plantuml:

PlantUML是一个通用性很强的工具,可以快速、直接地创建各种图表。

使用 PlantUML,您可以创建结构良好的 UML 图表,包括但不限于以下内容:

序列图

用例图

类图

对象图

活动图

组件图

部署图

状态图

时序图

plantuml网站:

使用简单的文字描述画UML图的开源工具。

ubuntu安装plantuml相关插件:

1.sudo apt install graphviz.

2.安装java.

3.vscode上安装plantuml插件.

4.在https://plantuml.com/zh/download上面下载 plantuml_xxx.jar 相关文件,并在vscode设置上面查找markdown-preview-enhanced.plantumlJarPath,把plantuml_xxx.jar的路径设置上去.

在vscode上新建一个markdown文件,例如sequence.md,然后输入如下内容:

示例

以下是一个简单的示例,展示如何在 Markdown 文件中嵌入一个时序图:

示例文档

```plantuml

@startuml

Alice -> "Bob()" : Hello

"Bob()" -> "This is very\nlong" as Long

' You can also declare:

' "Bob()" -> Long as "This is very\nlong"

Long --> "Bob()" : ok

@enduml

```

然后点击窗口右上角的MarkDown Preview Enhanced按钮

可以显示如下效果:

相关推荐
万粉变现经纪人3 小时前
如何解决pip安装报错ModuleNotFoundError: No module named ‘python-dateutil’问题
开发语言·ide·python·pycharm·pandas·pip·httpx
Adorable老犀牛7 小时前
可遇不可求的自动化运维工具 | 2 | 实施阶段一:基础准备
运维·git·vscode·python·node.js·自动化
Lecxcy_Kastreain8 小时前
解决VSCode默认F5配置无法启动调试器的问题
ide·vscode·编辑器
胡乱编胡乱赢10 小时前
在pycharm终端安装torch
ide·深度学习·pycharm·安装torch
梁小憨憨10 小时前
PyCharm 连接 AutoDL 远程服务器
服务器·ide·pycharm
T0uken10 小时前
【C++】LLVM-mingw + VSCode:Windows 开发攻略
c++·windows·vscode
一骑红尘荔枝来14 小时前
转载:VSCODE 关闭文件和资源管理器关联
ide·vscode·编辑器
float_六七16 小时前
IntelliJ IDEA双击Ctrl的妙用
java·ide·intellij-idea
android_xc18 小时前
Android Studio国内仓库配置
android·ide·android studio
2501_9159184118 小时前
Web 前端可视化开发工具对比 低代码平台、可视化搭建工具、前端可视化编辑器与在线可视化开发环境的实战分析
前端·低代码·ios·小程序·uni-app·编辑器·iphone