[Document & Workflow] Visual Studio Code + okazuki PlantUML でテキストから UML を書く方法

テキストから UMLを生成する Visual Studio Code の機能拡張。
PlantUML を Mac に設定して利用する。

[markdown]
> * [runceel/plantumlpreview](https://github.com/runceel/plantumlpreview)
> * [Visual Studio Codeで自由自在にUMLを描こう – かずきのBlog@hatena](http://blog.okazuki.jp/entry/2016/09/01/215508)
> * [okazuki PlantUML – Visual Studio Marketplace](https://marketplace.visualstudio.com/items?itemName=okazuki.okazukiplantuml)

## ライブラリのインストール

`Java` と `Graphviz`, `PlantUML` が必要との事なのでインストールする。

“`prettyprinted
% brew install Graphviz PlantUML
“`

### Java

なければ `brew cask install java` できる。

### Graphviz

インストール後、`dot` コマンドが利用できる。
動作を確認する。

“`prettyprinted
% which dot
/usr/local/bin/dot
“`

以下のファイルを用意し、

“`:uml.dot
graph g{
“Hello World”
}
“`

以下を実行すると PDF が生成される。

“`prettyprinted
% dot -Tpdf uml.dot -o uml.pdf
“`

2016-11-08_plantuml_01

> * [Graphviz | Graphviz – Graph Visualization Software](http://www.graphviz.org/)

### PlantUML

インストール後、`plantuml` コマンドが利用できる。
動作を確認する。

“`prettyprinted
% which plantuml
/usr/local/bin/plantuml
“`

以下のファイルを用意し、

“`:uml.txt
@startuml
A -> B: message
B –> A: response message
@enduml
“`

以下を実行すると PNG が生成される。

“`prettyprinted
% plantuml uml.txt
“`

2016-11-08_plantuml_02

> * [インストールに関するよくある質問](http://plantuml.com/faq-install)

## 設定

### 拡張のインストール

Visual Studio Code にインストール。
`Cmd + P` を押して `ext install okazukiplantuml` を完了する。

2016-11-08_plantuml_03

### 環境変数を設定する

.zshrc などに `$JAVA_HOME` を設定する。

“`:.zshrc
export JAVA_HOME=$(/usr/libexec/java_home)
“`

> * [$JAVA_HOME by java_home MacOSX – Qiita](http://qiita.com/yohjizzz/items/194973bf2f34608ae85a)

さらに .zshrc などに `$PLANTUML_JAR` を設定する。
`.jar` ファイルの場所を指定する必要があるようなので探して設定する。

“`:.zshrc
export PLANTUML_JAR=”/usr/local/Cellar/plantuml/8048/libexec/plantuml.jar”
“`

> * [runceel/plantumlpreview](https://github.com/runceel/plantumlpreview)

### 再起動

シェルとアプリを再起動しておく。

## 実行

`Cmd + P` の後、`>plantUML …` でコマンドが実行できる。

## 補遺

> * [Atom + PlantUML でテキストから UML を書く方法 | deadwood](https://www.d-wood.com/blog/2016/12/01_8567.html)
[/markdown]