MacでMarkdown+umlを書きたかった(VSCode)

まえがき

Markdown+umlを書く機会がローカル(Mac)であった。 というよりWebサービス上で書くとサービスの性質上 publicにしないと下書きにできなかったので...

今回はVSCodeに拡張機能をインストールして対応した。

拡張機能 Markdown Preview Enhancedの準備

今回はMarkdown Preview Enhancedを使用した。 marketplace.visualstudio.com

今回やりたいuml(plantuml)だけでなく、PDF出力やhtml出力もできるスグレモノ。

拡張機能は[表示]->[拡張機能]で拡張機能メニューを出してMarkdown Preview EnhancedをインストールすればOK

plantumlの準備

plantumlをインストールする前にjavaが必要なのでjavaをインストールしておく
brew cask install java

その後graphvizもインストールしておく brew install graphviz

plant umlのインストール

こちらもbrewを使ってインストールする

brew install plantuml

確認

vscodeで適当にmarkdownを作って以下のように書いてみる

# test

````plantuml
title test
class Class
````

そして.md形式で保存しておく。

その後 command+k -> vでpreviewを表示するとumlが表示される

まとめ

ローカルでmarkdown+umlをかけると捗るようになる。 htmlやpdfでの出力もできるし便利に使いたい。