【Next.js】開発サーバーでUnhandleなエラーが発生した際にnext-code-frameのpanicが起きる

概要

Next.jsで実装でハンドルしていないエラーが起きた場合、開発用のサーバー起動であれば通常は以下のようなスタックの表示がされると思います。

しかしスタックが表示されず、next-code-frameでpanicが起きてサーバーが落ちてしまう事象に遭遇したので、今回はその内容をメモ書きしておきます。

前提

• 使用したNext.jsは16.2.12です。

事象の詳細など

[Error Overlay] Dev server aborts: next-code-frame panic on multi-byte source (terminal width)のissueにある通り、スタックを表示するハイライトの処理で日本語等のマルチバイト文字が含まれていると、panicが起きる場合があるそうです。next-code-frameの該当のコードはRustで書かれています。

いつからRustで実装になったのか

Reimplement code frame rendering in native codeのPull Requestから推測するに、Next.jsの16.2.1以降なのかなと思います。元々はbabel/code-frameを使用していたそうですが、メンテナンスやパフォーマンスなどの観点からこれを使用するのをやめてRust実装に切り替えたそうです。