gatsbyビルド時にmaterial-uiのスタイルが崩れてしまった
gatsbyで開発したspaをリリースしたらmaterial-uiで構成したコンポーネントのスタイルが崩れていました。どうやらプラグインを入れないとmaterial-uiのスタイルが崩れてしまうようです。
修正法がわかったので、共有しようと思います。
スタイル崩れの修正法
1、gatsby-plugin-material-uiをインストール
npm install gatsby-plugin-material-ui @material-ui/styles
もしくは
package.jsonに以下のようにgatsby-plugin-material-uiを加える
その後、npm installを実行
2、gatsby-config.jsにgatsby-plugin-material-uiプラグインの情報を入力する必要がある
gatsby-config.jsに以下のようにgatsby-plugin-material-uiを加える
これで、再ビルドするとmaterial-uiのcssなどのスタイルが整った。
gatsby developで立ち上がる開発環境でスタイルが崩れてない人もgatsby serveでビルド時の（本番）環境が立ち上がるのでリリース前には試しておいたほうがいいと思います。