Visual Studio Code + MarkDown で画面遷移図を描写しようとしたけどつまずいた時の話し

前置き

新しいプロジェクトにアサインされて、画面遷移図を見てみると

お、MarkDown で書かれてるのね。

なので、Visual Studio Codeを起動して、プレビュー表示してみたところ

あれ？　描写されないぞ。。。

となったので、対応した時の手順のメモになります。

実際にやったこと

一先ず、アサインされた案件の方々にどうしたら良いか聞いてみたところ

とか

とか回答いただけました。

まだ良く分かっていないですが、以下は必要そうだという事は分かりました。

「Markdown Preview Enhanced」をインストール

いただいたリンクを確認してみる。
https://qiita.com/asuzuki2008/items/87c09a91cc53b15a7555

こちらの導入手順に記載してある内容を実施してみました。

「Graphviz」をインストール

記載されているURLにアクセスしたんですが、私はパッケージファイルを見つけることができなかったので、同じような方は以下からダウンロードするのが良いかもしれません。
▼ Windows Packages
https://graphviz.gitlab.io/_pages/Download/Download_windows.html

ダウンロードしたらインストールしてください。

これで描写出来る！と思いプレビュー表示をしてみました。

Error: write EPIPE
Error [ERR_STREAM_DESTROYED]: Cannot call write after a stream was destroyed

いや、エラーなんですけど。。。

ここから、「plantUML」をインストールしてみたり

こちらの記事を参考にしてみたり
https://qiita.com/zonbitamago/items/7946acfb4cbaa139f00a

対応をしていたのですが、一向にエラー解消せず。。。

「java」 をインストール

Google先生に質問攻めしていると、どうもJava入っていないと使えないっぽいとのお告げが。。。

とりあえずJava先生をインストールしてみる。
https://www.java.com/ja/

Visual Studio Code を再起動して、再度プレビュー表示をクリックしたところ

やっと表示されました！！

まとめ

Markdown Preview Enhanced を使用するのに必要な設定は

• 「Java」 のインストール
• Visual Studio Codeに「Markdown Preview Enhanced」のインストール
• 「Graphviz」のインストール

でした。

途中「plantUML」もインストールしましたが、無効にしても図形描写は出来たのでインストールは必要ないかもです。

以上、参考にさせていただいたサイトの皆々様方、ありがとうございました。