[備忘録] Next.jsのIncremental Static Regenerationの挙動を確認した際のメモ

Next.jsでIncremental Static Regenerationの設定を行ったときにプチハマったことを備忘録がてら書きます。

Next.js 9.5 - Stable Incremental Static Regeneration

ちなみにここで使用しているNext.jsのversionは v9.5.3 となります。

なお、ここで書く内容はソースコードレベルでの確証が取れていません。
動作確認自体は取れているので間違ってはいないと思いますが、、、一応その旨を先に記載させていただきますm(_ _)m

next dev を叩いて開発モードでアプリを立ち上げている場合、getStaticPathsで fallback: true になるリクエストが来ても、静的なファイルは生成されないため、本番と同一の挙動を確認することは出来ません。
(リクエスト自体は正常に処理されますが、最初のリクエストが来たあと、再度同じページにアクセスしても静的ページは生成されていません。このことからファイル生成処理は動いていないものと思われます)

本番と全く同じ挙動を確認する場合は
(あえて書くまでもないかもしれませんが)

next build
next start

と実行する必要があります。

next start で立ち上げたあと、最初のアクセス時に静的ページが生成されるので、２回目に同じページにアクセスした際には生成済みのHTMLファイルが返ります。
これについては、ページのソースを表示させることで表示されているHTMLが生成済みのものであることを確認できるかと思います。

最初 Incremental Static Regeneration の挙動を確認しようとして、next dev で動かしていたところ、何故か静的ファイルの生成が動いていないと思い、少しハマったので一応こちらにメモを残しておくことにしました。

あとがき

next dev で立ち上げた場合、静的ファイル生成処理が動いていないところをソースコードから突き止めて該当箇所もあげようと考えていましたが、自分のスキル不足もあり、コード上の確証は完全には得られていません。たぶん、コード上の処理追っていった感じ、該当する部分は動いていなそうだなといった感じです。
(もちろん実際にアプリを動かした上での確認は取れていますが)

もし誤りなどありましたらコメント頂けたらと思います。

あと、考えてみれば next dev 実行時に静的ファイル生成する必要自体がそもそもないので、ファイル生成処理を省いているのは当然といえば当然かもしれません。