Closed2

VSCodeにPlantUML拡張機能を導入する(2022)

ふじしろふじしろ

PlantUML公式(日本語)

https://plantuml.com/ja/

VSCode拡張機能の情報

PlantUML - Visual Studio Marketplace

詳細

名前: PlantUML
ID: jebbs.plantuml
説明: Rich PlantUML support for Visual Studio Code.
バージョン: 2.17.4
パブリッシャー: jebbs
VS Marketplace リンク: https://marketplace.visualstudio.com/items?itemName=jebbs.plantuml

環境構築

前提

  • macOS Monterey M2チップ
  • java:インストール済み
  • Graphviz:未インストール

導入

VSCodeの拡張機能からPlantUMLをインストール。
公式やいろいろな記事を見ていると、Graphvizの導入が必要な雰囲気だったが、導入しなくてもプレビューできた。

デフォルトでPlantUMLサーバに接続されているのかと思ったが、デフォルトはローカルになっているようなので、おそらくローカルで動作している。
以下公式のAbout Renderより抜粋

Local is the default and traditional way.
PlantUML - Visual Studio Marketplace

と、思ったら公式にちゃんと書いてあった。

PlantUMLの実行には以下の二つが必要です:

  • Java
  • Graphviz (シーケンス図とアクティビティ図(新構文)のみ使用するのであれば、これは不要です。)

つまりシーケンス図か新構文のアクティビティ図であればGraphvizは不要。

使用時の参考

各図の基本的な書き方は公式を参照

スニペット機能

例えばacifeと入力するだけで以下のコードが出力できるとのこと。

if (cond1?) then (val1)

else (val2)

endif

acifeというのは、activity➤if・elseの省略形とのことで、
"アクティビティ図if / else構文"を表す。
アクティビティ図以外の図でも同様に使えるらしいので覚えておくと記述が捗りそう

This plugin integrates all type diagram snippets. They are splitted into 9 sections:

  • diagram: snippets for general diagrams elements.
  • activity: snippets for activity diagrams.
  • class: snippets for class diagrams.
  • component: snippets for component diagrams.
  • state: snippets for state diagrams.
  • usecase: snippets for usecase diagrams.
  • sequence: snippets for sequence diagrams.
  • ui: snippets for salt diagrams.
  • egg: snippets for some funny diagrams, like sudoku, earth.

PlantUML - Visual Studio Marketplace

このスクラップは2022/11/26にクローズされました