はじめに
Next.jsでparamsが正しく受け取れない問題が発生したため、解決方法をまとめてみました。
問題
Next.jsで今まで通り params を使用する際、値がnullになっておりルーディング機能が使用されない事態が発生しました。Next.jsでは13以降でTurbpackが使用できるようになっています。
調べてみると特定の環境課で、、動的ルート ([id]) の params がundefinedになり、以下のようなエラーが出る場合があります。
Error: Route "/portfolio/[id]" used `params.id`.
解決方法
以下のコマンドで従来のWebpackビルダーに切り替える。
next dev --no-turbo
まとめ
今回のエラーは、最初まったく原因が分からず、本当に苦戦しました。
しかし調べていくうちに、最新機能はまだ不安定な部分があるということを初めて実感として学ぶことができました。
Turbopackは確かにビルドが速く、将来的に期待できる機能ですが、
現時点では開発中の要素も多く、安定性を優先するなら
従来のWebpackを使う選択も重要だと感じました。
JISOUのメンバー募集中!
プログラミングコーチングJISOUでは、新たなメンバーを募集しています。
日本一のアウトプットコミュニティでキャリアアップしませんか?
興味のある方は、ぜひホームページからお気軽にカウンセリングをお申し込みください!
▼▼▼
下記記事ではCSSの紹介ページを運営していますので参考にしていただければと思います。
▼▼▼