VSCode で PlantUML をプレビューする

準備

• PlantUML のインストール
• Vscodeのインストール
• VSCodeで plantUMLプラグインのインストール

vscode のインストール

Windows の場合

choco install vscode 

Macの場合

brew install --cask visual-studio-code

プラグインのインストール

PlantUML のインストール

choco install plantuml

インストールするとOpenJDKも一緒にインストールされる。

## java と plantuml.jar のパスを確認。

インストールされた場所の確認する。

choco でインストールすると普段と違う場所になったりするので、 実際の場所 を cmd.exeで確認。

# javaの場所

C:\Users\takuya>where java
C:\Program Files\AdoptOpenJDK\jre-15.0.1.9-hotspot\bin\java.exe

# plantuml の場所

plantuml.jar がほしいのだけれど、 plantuml.jar を探すのは手間なので、先に plantuml.exe を探す。

C:\Users\takuya>where plantuml

C:\ProgramData\chocolatey\bin\plantuml.exe

これで、 plantuml がインストールされた場所がわかった。

choco でインストールすると、choco のは以下に作られるのが面白いですね。

java の場所

where java

確認したら次のようになっていました。

C:\Users\takuya>where java
C:\Program Files\AdoptOpenJDK\jre-16.0.1.9-hotspot\bin\java.exe
C:\Program Files\AdoptOpenJDK\jre-15.0.2.7-hotspot\bin\java.exe

java.exe の場所はアップデートで頻繁に変わるので困ります。 バージョン番号なしでアクセスできるようにしてほしい・・・

エクスプローラーで開いて確認

plantuml がインストールされた場所がわかったので、このフォルダを開いて plantuml.jar を探す。

インストールした箇所をエクスプローラーで確認します。見つけました。

plantuml.jar と java.exeのパスを設定へ

先程探した、これらのPATHを、PlantUMLのプラグイン設定に追加。

拡張子 PU のファイルを作る

@startuml test

class PlantUml

@enduml

このファイルをVS Codeで確認

ALT-D を押してプレビュー

もしプレビューがどうしても使えないとき

そして、どうしてもUMLの作成を急ぐときは、オンライン変換を使う。 http://www.plantuml.com/plantuml/uml/SyfFKj2rKt3CoKnELR1Io4ZDoSa70000

マニュアルについて

日本語マニュアルもあるので大丈夫だよ。 https://plantuml.com/ja/download

2021-07-09

PlantUMLでマッチなかったので、記述を見直し