react-jsonschema-form(@rjsf/core) を使う場合は material-ui を使うしかない

DRANK

jsonschema から form を生成してくれる react-jsonschema-form というライブラリがある。デモページをみたところ、かなり良く出来てるように感じたので、使ってみた。react-jsonschema-form playgroundだが、いざ使ってみるとかなり混沌とした状況だった。tldr@rjsf/core の出力は bootstrap@4 で壊れているbootstrap@3 を避ける場合 @rjsf/material-ui を使うしかない経緯まず、多くの紹介記事は古く、react-jsonschema-form は @rjsf/core に名前が変わっているbootstrap@3 は jquery 依存が残っているなど、レガシーな設計なので、可能な限り避けたい@rjsf/core は bootstrap@3 の CSS を前提にした出力をするbootstrap@4 では、アイコンで使われた gryphicon が有料化したためドロップされていおり、これを使った @rjsf/core の出力が壊れる(ボタンほぼ全部)公式には font-awesome などを使うように推奨されているが、@rjsf/core ではライブラリの出力に組み込まれているので、治すのが難しいじゃあ @rjsf/core が bootstrap4 対応をしているかと言うと、している気配がないその代わりに @rjsf/material-ui の開発をしている@rjsf/material-ui を使ったコードimport { I…