Vscode plantuml UML图 配置使用

安装 Java 环境

注意配置 $JAVA_HOME 环境变量
配置完毕后启动 Windows Shell 执行 java -showversion 命令查看 Java 版本,以确定 Java 环境是否准备成功。

安装 GraphViz 程序

下载地址:http://www.graphviz.org/Download_windows.php
一般都是64位,选择stable版的64位下载程序即可
下载安装完后,也要配置环境变量,
将 GraphViz 可执行程序路径配置到 $path:
在这里插入图片描述

配置dot:

即刚才的地址里面的dot.exe
Vscode plantuml UML图 配置使用_第1张图片
检查是否配置成功,win命令台输入

dot -v

vscode 下载插件 plantuml 以及 Graphviz

Vscode plantuml UML图 配置使用_第2张图片

测试

新建一个文件,后缀为.wsd,代码如下所示,写完后 alt+D 查看预览

@startuml
abstract class Newspaper {
	~abstract void registerObserver(Observer o);
	~abstract void removeObserver(Observer o);
	~abstract void updateObserver();
	#Vector<Observer> observer_vector;
	+String news;
	~abstract void updateNews(String string);
}
abstract class Observer {
	abstract void updateNews();
	#Newspaper newspaper;
}
class PCObserver extends Observer{
	public PCObserver(Newspaper n) 
	void updateNews()
}

class PhoneObserver extends Observer{
	public PhoneObserver(Newspaper n)
	void updateNews()
}
class RenminNewspaper extends Newspaper{

}
Newspaper "1" *.. "*" Observer : contains 
Observer --> Newspaper : 引用
note right of RenminNewspaper : customer use this class set and update news
@enduml

Vscode plantuml UML图 配置使用_第3张图片

ctrl + shift +p 输入plantuml 查看常用命令,可以有导出图片等操作

总结

还是很好用的工具,具体语法可以学习这篇博客.
类图的语法可以学习这篇博客.

你可能感兴趣的:(vscode,uml,graph)