ブログをNext.js14.2にアップデートしました

📅 2024-05-01

ブログをNext.js14.2にアップデートしました

🔄 2024-05-01

公式ブログ：

読む限り、特に手直しする部分がないことが分かります。

エラー画面が分かりやすくなったようですが、残念ながらサーバーとの格闘が多かったので恩恵はまだ受けられていません。

yarn add next@14.2

これで終了です。

ですが、他の部分で結構苦労しました。。。。

Netlifyプラグインのdefaultバージョンが5に上がった

私は商用利用もするかもしれない..?

アフィリエイトリンクをたまに入れてたりする…?ので、

VervelにBANされないように、Netlifyを使っています。

基本的にはVervelと同じでしたが、

数週間前から急にbuild時にエラーが出るようになりました。

6:08:47 PM:   Error: Your publish directory does not contain expected Next.js build output. Please make sure you are using Next.js version (>=13.5.0)
6:08:47 PM: 
6:08:47 PM:   Plugin details
6:08:47 PM:   Package:        @netlify/plugin-nextjs
6:08:47 PM:   Version:        5.1.2
6:08:47 PM:   Repository:     git+https://github.com/netlify/next-runtime-minimal.git
6:08:47 PM:   npm link:       https://www.npmjs.com/package/@netlify/plugin-nextjs
6:08:47 PM:   Report issues:  https://github.com/netlify/next-runtime-minimal/issues
6:08:47 PM: 
6:08:47 PM:   Error location
6:08:47 PM:   In "onBuild" event in "@netlify/plugin-nextjs" from Netlify app
6:08:47 PM:

easy-notion-blog以外にTailwind-nextjs-starter blogというのを使っていますが、

そちらは、netlifyプラグインを最新版にするだけで無事通過しました。

今までは、プラグインも入れずの状態でも動いていたので、急にエラーになった時は驚きましたが、プラグインを追加するだけで特に問題はありませんでした。

今回も同じようにプラグインを入れてみたところ、全然改善されず数日ハマりました。

バージョンを下げたらうまくいった

Prerequisites

Next.js version 13.5 and later (up to the latest stable version)
Node 18.x or later
The latest version of Netlify CLI

Next.jsは14.2ですし、Nodeは18.17です。

てっきり該当するのかと思っていましたが、netlify CLIは記憶にないので、おそらくここに引っかかったのかもしれません。

さらっと読んでみたけど、用はないかな… 😇

https://docs.netlify.com/cli/get-started/

v4に指定してプラグインをインストールすることにします。

yarn add @netlify/plugin-nextjs@4

おわりに

プラグインのバージョンが合わないという原因を突き止めるまでに苦労しました。。。

Netlifyにいつも広告のようにお知らせが載っているところに、今回のネタがあって、もしやとおもって試してみたら見事ビンゴでした。

ローカルでエラーのまま放置している部分が悪さをしているのかと思い、
lintやjestのエラーを取り除いたり、
buildのエラーが環境変数のundifinedだったということも見つけたり、
手当たり次第エラーの可能性をつぶしていきました。

結果としては、全然関係なくってただのNetlify側の変更だったのですが、何から解決させればいいのか….というアンテナだけは無駄に鍛えられた気がしますw

もうメンテをはじめて１年が経つんですね。。。。。なんか、感慨深い。。。。

話は戻りますが、
13.5にしてからずっとvercelが500エラーになっています。

多分これもVercel側の変更が悪さしてるんだろうな…という勘は働いていますが、まだ解決には至っていません。

Error: Cannot find module '/var/task/.next/server/app/page_client-reference-manifest.js'
Require stack:
- /var/task/node_modules/next/dist/compiled/next-server/server.runtime.prod.js
- /var/task/___next_launcher.cjs
- /opt/rust/nodejs.js
    at Module._resolveFilename (node:internal/modules/cjs/loader:1140:15)
    at /var/task/node_modules/next/dist/compiled/next-server/server.runtime.prod.js:15:28048
    at Module._load (node:internal/modules/cjs/loader:981:27)
    at /opt/rust/nodejs.js:1:11597
    at Function.Qt (/opt/rust/nodejs.js:1:11967)
    at Q.e.<computed>.K._load (/opt/rust/nodejs.js:1:11567)
    at Module.require (node:internal/modules/cjs/loader:1231:19)
    at w.require (/var/task/node_modules/next/dist/compiled/next-server/server.runtime.prod.js:15:28264)
    at require (node:internal/modules/helpers:177:18)
    at ru (/var/task/node_modules/next/dist/compiled/next-server/server.runtime.prod.js:21:9246) {
  code: 'MODULE_NOT_FOUND',
  requireStack: [
    '/var/task/node_modules/next/dist/compiled/next-server/server.runtime.prod.js',
    '/var/task/___next_launcher.cjs',
    '/opt/rust/nodejs.js'
  ],
  page: '/'
}