半年ぶりにGatsbyJSを使ってブログをローカルで確認しようとしたところ、gatsby developを実行したところで大量のエラーが発生してしまいました。
対策として、libvipsのインストールとGatsbyJSおよびスターターキットで採用しているパッケージのアップデートを行うことで、エラーなくgatsby developを実行し、ブラウザからlocalhost:8000にアクセスできるようになりました。
対策に至るまでの過程で苦労したので、手順を残しておきます。
対策手順
-
sharpモジュールのために必要なlibvipsをbrew install vipsでインストール - （エラーが出て止まってしまったら
brew doctorで対策コマンドを確認して実行し、再度brew install vips） -
npm outdatedでアップデートが必要なバージョンを確認しpackage.jsonの各パッケージのバージョンを書き換える -
npm updateでアップデートする - （必要に応じて
npm uninstall gatsby-cli -gとnpm install gatsby-cli -gでgatsby-cliを最新版にアップデートしてから再度npm updateを実行する）
当初は大量のエラーが出てくるので面食らいましたが、結局はlibvipsのインストールとpackage.jsonの書き換えによるGatsbyJSおよび各パッケージのアップデートを行うことで正常に動作できるようになりました。
ちなみにnpm outdatedを実行すると以下のようにバージョンを表示してくれます。
$ npm outdated
Package Current Wanted Latest Location
gatsby-plugin-manifest MISSING 2.2.29 2.2.29 gatsby-starter-blog
gatsby-image 2.0.40 2.2.33 2.2.33 gatsby-starter-blog
gatsby-plugin-feed 2.1.1 2.3.21 2.3.21 gatsby-starter-blog
gatsby-plugin-google-analytics 2.0.18 2.1.28 2.1.28 gatsby-starter-blog
gatsby-plugin-offline 2.0.25 2.2.10 3.0.22 gatsby-starter-blog
gatsby-plugin-react-helmet 3.0.12 3.1.15 3.1.15 gatsby-starter-blog
gatsby-plugin-sharp 2.0.35 2.3.2 2.3.2 gatsby-starter-blog
gatsby-plugin-typography 2.2.13 2.3.17 2.3.17 gatsby-starter-blog
gatsby-remark-copy-linked-files 2.0.12 2.1.30 2.1.30 gatsby-starter-blog
gatsby-remark-images 2.0.6 2.0.6 3.1.32 gatsby-starter-blog
gatsby-remark-prismjs 3.2.8 3.3.23 3.3.23 gatsby-starter-blog
gatsby-remark-responsive-iframe 2.1.1 2.2.27 2.2.27 gatsby-starter-blog
gatsby-remark-smartypants 2.0.9 2.1.16 2.1.16 gatsby-starter-blog
gatsby-source-filesystem 2.0.32 2.1.38 2.1.38 gatsby-starter-blog
gatsby-transformer-remark 2.3.12 2.6.37 2.6.37 gatsby-starter-blog
gatsby-transformer-sharp 2.1.18 2.3.5 2.3.5 gatsby-starter-blog
prettier 1.17.0 1.19.1 1.19.1 gatsby-starter-blog
prismjs 1.16.0 1.17.1 1.17.1 gatsby-starter-blog
react 16.8.6 16.12.0 16.12.0 gatsby-starter-blog
react-dom 16.8.6 16.12.0 16.12.0 gatsby-starter-blog
react-helmet 5.2.0 5.2.1 5.2.1 gatsby-starter-blog
typeface-montserrat 0.0.54 0.0.54 0.0.75 gatsby-starter-blog
原因について
libvipsがインストールされていなかったこと（もしくはバージョンが古かったこと）と、sharpモジュールが要求するバージョンとGatsbyJSおよび各パッケージのバージョンの不一致によるビルドエラーが原因だったようです。
libvipsのインストールのあとは、上記のGatsbyJS公式を見て、そのまま実行するだけでした。
所感
環境構築関連の対策は振り返ればあっけない内容ですが、対策を行っている間は暗中模索の状態で不安や苛立ちが募ってしまいます。些細なことではありますが、こういった対策記事を積み重ねていこうと思います。