🛬

Cloudflare Pages で GatsbyJS を使って SSG する時の各バージョンの指定

2022/11/23に公開約1,500字

Reactベースの静的サイトジェネレーターGatsbyを使ってCloudflare Pagesでビルドしてホスティングするときに、バージョンによる制限があって、ちょっとハマった。

※逆に自分がハマっていないところは書いていないが、おそらくバージョンを指定する必要があると思う。

Node.js のバージョン

Cloudflare Pages の Node.js のデフォルトバージョンは12.18.0

Supported versions はAny version up to 17.xとあるので、17.xでバージョンを指定する。
(ここでv18を選択出来ない事がすべての問題の根源)

指定するファイルは.nvmrc.node-version

.nvmrc
17.9.1

https://developers.cloudflare.com/pages/platform/build-configuration/

Gatsby のバージョン

gatsbyの最新版は2022年11月時点で5.x

5.xでは Node.js 18 に依存しているため、最新の Gatsby は Cloudflare Pages でビルド出来ない。

https://www.gatsbyjs.com/docs/reference/release-notes/v5.0/

そのため、最新ではない4.x系をインストールする必要がある。

npm install gatsby@4.x

gatsby-plugin-styled-components のバージョン

gatsby-plugin-styled-componentsの最新版は2022年11月時点で6.x

6.xgatsby-plugin-styled-componentsは、5.xgatsbyに依存している為、これもバージョンを落とす必要がある。

こちらはリリースノートなどはなかったが、 GitHub の History から見た限り、5.x系にすれば良さそう。

npm install gatsby-plugin-styled-components@5.x

その他

Cloudflare Pages の Node 18 対応はちょくちょく話題に出ている模様。

https://community.cloudflare.com/t/support-node-18-in-pages-or-allow-config/414797

これは new build image が出来たらサポートされますよ、とのこと。
(一体いつリリースされるのか。。)

https://github.com/cloudflare/pages-build-image/discussions/1

Discussions では Gatsby 5 が node 18 required になったので問題になってるよ、との声がちらほらあります。

Discussion

ログインするとコメントできます