若VSCode中PlantUML插件无法渲染UML图,需依次安装PlantUML插件、配置Graphviz(验证dot命令并设置路径)、配置Java环境(JDK 11+并指定java.path),再编写@startuml代码并通过Cmd+K P预览及导出PNG/SVG。

如果您在VSCode中安装了PlantUML插件,但无法正常渲染UML图表,则可能是由于插件未正确配置或依赖的Graphviz与Java环境缺失。以下是实现用代码绘制UML图的具体操作步骤:
本文运行环境:MacBook Air,macOS Sequoia。
一、安装PlantUML插件并验证基础功能
该步骤确保插件已成功加载,并能识别.plantuml文件类型。插件需启用语法高亮、实时预览及导出功能。
1、打开VSCode,点击左侧活动栏的扩展图标(或按快捷键Ctrl+Shift+X)。
2、在搜索框中输入PlantUML,选择由jebbs发布的官方插件,点击“安装”。
3、安装完成后重启VSCode,新建一个空白文件,将文件保存为example.plantuml,观察右下角是否显示“PlantUML”语言模式。
二、配置本地Graphviz环境
PlantUML默认使用Graphviz的dot命令生成类图、时序图等结构化图形,若未安装Graphviz,图表将无法渲染或仅显示文字描述。
1、访问https://graphviz.org/download/,下载对应macOS的.dmg安装包并完成安装。
2、打开终端,执行dot -V,确认输出类似dot - graphviz version 11.0.0的信息。
3、在VSCode设置中搜索plantuml.graphviz,将plantuml.graphviz.dot路径设为/opt/homebrew/bin/dot(Apple Silicon)或/usr/local/bin/dot(Intel Mac)。
三、配置Java运行时环境
PlantUML核心引擎以Java字节码运行,必须提供可用的JDK 11或更高版本,否则预览窗口将报错“Error: Could not find or load main class”。
1、终端中运行java -version,确认输出含11.、17.或21.字样。
2、若未安装,前往https://adoptium.net/下载Temurin JDK 17 LTS版本并安装。
3、在VSCode设置中搜索plantuml.java,将plantuml.java.path设为/Library/Java/JavaVirtualMachines/temurin-17.jdk/Contents/Home/bin/java。
四、编写并预览第一个UML类图
通过纯文本代码定义类结构,PlantUML插件可即时渲染为标准UML图形,无需绘图工具拖拽操作。
1、在example.plantuml中输入以下内容:
@startuml
class User {
+String name
+Integer age
+login()
}
class AuthService {
+authenticate(User)
}
User --> AuthService : uses
@enduml
2、按下Cmd+K,再按P,调出命令面板,输入PlantUML: Preview Current Diagram并回车。
3、右侧将弹出实时渲染的类图,包含User与AuthService两个矩形框及带箭头的关联线。
五、导出为PNG或SVG格式
渲染后的图表可直接导出为静态图像,便于嵌入文档或演示材料,导出过程不依赖外部截图工具。
1、在预览窗口右上角点击三个点菜单图标。
2、选择Export as PNG,指定保存路径并确认。
3、如需矢量图,改选Export as SVG,导出文件可在浏览器或设计软件中无损缩放。










