VSCode利用MarkdownPreviewEnhanced在Markdown中用PlantUML预览不了的解决办法

转自: https://blog.csdn.net/wei549434510/article/details/79587441

在 VS Code中安装Markdown Preview Enhanced插件后&＃xff0c;在Mrakdown使用PlantUML语法画相关UML图的不显示的问题

利用Markdown Preview Enhanced使用PlantUML语法&＃xff1a;
1、PlantUML的图形预览依赖于Graphviz软件。Windows版下载

2、配置环境变量
安装好Graphviz后&＃xff08;比如我安装在&＃xff1a;D:\Software\Graphviz&＃xff09;&＃xff0c;添加环境变量&＃xff1a;
变量名&＃xff1a;GRAPHVIZ_DOT
变量值&＃xff1a;D:\Software\Graphviz\bin\dot.exe
注&＃xff1a;变量值是根据我的安装目录配置的。

这样&＃xff0c;可以使用PlantUML语法显示图形了。

PlantUML是一个快速创建UML图形的组件&＃xff0c;官网上之所以称它是一个组件&＃xff0c;我想主要是因为多数情况下我们都是在Eclipse、NetBenas、Intellijidea、 Emacs、Word、VS CODE、Sublime等软件里来使用PlantUML&＃xff08;参看各软件相关配置&＃xff09;。

PlantUML支持的图形有&＃xff1a;

• sequence diagram,
• use case diagram,
• class diagram,
• activity diagram (here is the new syntax),
• component diagram,
• state diagram,
• object diagram,
• wireframe graphical interface

PlantUML通过简单和直观的语言来定义图形&＃xff0c;它可以生成PNG、SVG和二进制 图片。下面是一个简单的示例&＃xff1a;

&＃64;startumlBob -> Alice : Hello, how are you
Alice -> Bob : Fine, thank you, and you?&＃64;enduml

安装plantuml

plantuml实际上是安装的插件&＃xff08;VS CODE插件&＃xff09;&＃xff0c;需要graphviz渲染画图&＃xff0c;以及需要安装java支撑plantuml运行

1. 首先你需要安装VS CODE&＃xff0c;一般都有
2. 安装plantuml插件
3. 去 graphviz官网下载其安装包
4. 安装java

安装好之后&＃xff0c;新建一个文件&＃xff0c;使用上面的示例&＃xff0c;拷贝之后&＃xff0c;在win32下是alt&＃43;d&＃xff0c;mac下是command&＃43;d即可生成相关uml图

将脚本导出成图片

在脚本处右键&＃xff0c;即有导出图片的选项

语法

语法可以参照这篇文章&＃xff0c;非常详细

http://archive.3zso.com/archives/plantuml-quickstart.html#sec-5-1

或者想快速用可以参考这篇&＃xff0c;比较简略

http://www.jianshu.com/p/e92a52770832