Reactコンポーネントのライブサンプルをwebページに埋め込む: React Runner

最近Reactコンポーネントライブラリを作った。その際に、このライブラリで何ができるのかがサンプルコードとともに一目でわかるようなデモページを同時に作りたくなった。 実際のページは以下のようになった。サンプルコードがセットされたコードエディタと、ライブラリのReactコンポーネントのレンダリング結果が横に並んだ形。これが他の要素と共にwebページに埋め込まれている。 react-ymd-date-selectのデモページ TL;DR これを作るにあたって、 今回に関してはReact Runnerがベストだった。 比較対象は以下。 React Live サンプルコード中で import を使えない Sandpack (@codesandbox/sandpack-react) ネストしたパスのimportが使えない（import Something from "package/subpath"