ブログを Jekyll から Gatsby.js に乗り換えた
2019-10-14
Jekyll が古くなってきたので、Gatsby.js に乗り換えてみた。 乗り換え作業している最中に Jekyll v4.0.0 が出たのだけれども、どうせアップデート作業しないといけないんだったらもういいや、とそのままつっきった。
Gatsby.js はエコシステムに S3 等のホスティングサービスへデプロイする仕組みが入っているので、前よりはわかりやすいし、各ブログの部品も graphql query を意識しないといけない部分はあるものの、コンポーネントの作成に場面を意識しなくてもよいので意外にすんなり作成できた。
ヘッダ周りが、ベースにした gatsby-starter-blog と異なっていたので、ちょっと苦労したものの、それ意外は素直に作れた。
ハマったところ
$ gatsby build
で本番用にビルドをすると、トップページでコンテンツが表示されない。いろいろと探したところ、dangerouslySetInnerHTML does not work on production builds #11108 にぶち当たった。
#issuecomment-455472204 に、p タグは dangerouslySetInnerHTML が展開されないようなことが記載されていたので、p タグ -> div タグに変更したら表示されるようになった。
できた!と思ったらこれが発現してしまったので、一番焦った