はじめに
Next.js で ToDo アプリを作成中、npm run dev を実行したところ、
以下のエラーが繰り返し表示されるようになりました。
FATAL: An unexpected Turbopack error occurred.
A panic log has been written ...
画面自体は表示されるものの、アクセスするたびにエラーが出続ける状態でした。
同じ現象で困っている方の参考になればと思い、解決方法をまとめます。
発生した状況
Next.js プロジェクトを作成後、
npm run dev
を実行。
すると以下のようなログが何度も表示されました。
FATAL: An unexpected Turbopack error occurred.
A panic log has been written to C:\Users\xxxx\AppData\Local\Temp\next-panic-xxxx.log
ブラウザではページは表示されるものの、
リクエストのたびにエラーが出続ける状態でした。
原因
Next.js 16 では開発サーバー起動時に
Turbopack(新しいビルドツール) がデフォルトで使用されます。
今回の環境(Windows)では Turbopack が内部クラッシュ(panic)していたことが原因でした。
※コードのミスではありません。
解決方法:Webpackで起動する
package.json の scripts を修正して、Turbopackではなく Webpack を使うようにします。
変更前
"dev": "next dev"
変更後
"dev": "next dev --webpack"
再度起動
npm run dev
これでエラーが出なくなりました。
なぜ直ったのか
Turbopack の代わりに、従来から安定している Webpack を使用するようになったためです。
Turbopack は高速ですが、環境によってはクラッシュする場合があるようです。
まとめ
もし以下のエラーが出続ける場合は、
FATAL: An unexpected Turbopack error occurred
package.json の dev script を変更してみてください。
"dev": "next dev --webpack"
同じ現象で困っている方の助けになれば幸いです。