GitBook でシーケンス図を書く（mermaidプラグイン）

CLI 版の Gitbook でシーケンス図やダイアグラムを書きたかったのでプラグインを入れてみたけど、ちょいハマりしたメモ

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

ぐぐってると以下のプラグインがあったので入れてみた。
https://github.com/hypc/gitbook-plugin-mermaid

 ```mermaid
sequenceDiagram
  participant App
  participant API
  App->>+ API: ログイン
  API-->>- App: レスポンス
```

こんな感じで書いて gitbook serve でブラウザ確認してみると

うん、ちゃんと表示されてる。

で、一通りドキュメントが出来上がったところで Firebase Hosting に書き出したHTMLをデプロイする。

すると

なんじゃこりゃ、シーケンスがレンダリングされずに文字列で出力されちゃってる。。。
リロードすると表示されたりされなかったり。。
どうも mermaid の初期化の処理あたりでコケてるっぽいけど特にエラーが出てる気配も無いし。。
これはこのままだとちょっと使えない、どうしよう。。

ということで小一時間（実際はもうちょっと）色々試したり調べたりで試行錯誤した結果

別の mermaid プラグインがあったので試してみることに
https://www.npmjs.com/package/gitbook-plugin-mermaid-gb3

↑ローカルでの表示。スタイルがちょっと変わっちゃったけどまぁ全然問題なし。

で、おそるおそる Firebase にもデプロイしてみると。

おー、ちゃんとレンダリングされてる

ということでプラグインを変更することで解決しました。
こういう変なところでつまづいて時間とられるのはつらいですね。

おわり