Cloudflare Pagesで「Node」のエラー。デフォルトバージョンは12なので変更必須

静的サイトのホスティングサービスの「Cloudflare Pages」は、Jamstack構成のサイトを日本から公開する際には、とても扱いやすいサービスです。有名どころとして「Netlify」も候補に挙げられるのですが、無料で使えるStarterプランの場合、2023年1月現在、日本国内にエッジサーバーが配置されておらず、公開されたサイトを日本から閲覧する場合には、表示が若干遅くなってしまい、CDNの恩恵をあまり受けられない状態です。

その「Cloudflare Pages」ですが、ビルドの途中で「The engine "node" is incompatible with this module. Expected version "^12.20.0 || ^14.13.1 || >=16.0.0". Got "12.18.0"」というようなエラーが返されることがあります。これは、「Cloudflare Pages」のNodeのデフォルトのバージョンが「12.18.0」を使われてしまっている為に起こるエラーで、正常にビルドすることが出来ません。

このエラーは「Cloudflare Pages」の設定を変更して、Nodeのバージョンを上げることで解消されます。

「Cloudflare Pages」のNodeのバージョンを上げる手順

「Cloudflare Pages」から対象のサイトを開き、「設定（Settings）」→「環境変数（Environment variables）」→「プロダクション（Production）」の「変数を追加する（Add variables）」をクリックします。

ここで、「Cloudflare Pages」の環境変数を設定することができます。今回はNodeのバージョンを変更したいので「変数名（Variable name）」に「NODE_VERSION」を入力し、「値（Value）」に16を入力して「保存（Save）」をクリックします。

これで「Cloudflare Pages」のNodeのバージョンが16に変更されました。他にも、ヘッドレスCMSとアクセストークンなどを指定して連携する際にも、こちらに変数と値を設定することになりますので、覚えておきましょう。

また、Nodeのバージョンは、2023年1月現在で最新（LTS）の「18」にしたいところなのですが、まだ「Cloudflare Pages」が対応していないようです。いつになったら対応してくれるのかは不明なのですが、静的サイトジェネレータの「Gatsby　5」ではNode18以上が必要となっており、「Cloudflare Pages」にデプロイする際には、Gatsbyのバージョンを下げる必要があります。

それについては、また別の記事で紹介したいと思います。まずは、もう一度デプロイをして正常にビルドされることを試してみてください。

>> GatsbyでCloudflare Pagesを利用する場合はバージョンに要注意

まとめ

Nodeのバージョンは、サイトを作成した時の最新のバージョンが使われると良いのですが、初期の状態ではバージョンは12になっているので、まずはこちらを変更するようにしましょう。また「Cloudflare Pages」は、管理画面を日本語に変更することも出来ますので、英語が苦手な人には嬉しいですね。