会社でDocusaurusを提案したのですが「PlantUMLを使いたい」という意見がでました。PlantUMLは需要が高いのでおおかた標準もしくはプラグインがあるだろうと思って探したらありました。

remarkable-plantuml

環境はDocusaurus 1.7.2で試しました。DocusaurusはremarkableというMarkdownパーサーを使用しており、remarkableがプラグインによる拡張が可能なようです。前述のプラグインはそれを利用してDocusaurusにPlantUMLの描画機能を付与しているようです。

READMEに書いてあるとおり、yarnでインストールします。

1
yarn add remarkable-plantuml

その後はsiteConfig.jsに下記を記述するだけです。このmarkdownPluginsのキーはデフォルトでは存在しないので自分で記述する必要があります。公式の説明はこちら

1
2
3
4
5
markdownPlugins: [
(md) => {
require('remarkable-plantuml')(md, {base_path: './static'});
}
]

後はMarkdownにPlantUMLを書けば表示されます。

所感


プラグインでサクッと拡張できるのは便利ですね。この感じだと手軽にプラグインを自作できそうです。しかし、肝心のremarkableが個人開発なプロダクトなのは少しだけ心配ですね…。