【Next】This build is using Turbopack, with a `webpack` config and no `turbopack` config. This may be a mistake.の解決方法

はじめに

Next.jsをアップデートした際に発生したエラーと、その解決方法についてまとめた記事です。

現象

Next.jsをv16にアップデートした後、ビルド時に以下のエラーが発生しました。

This build is using Turbopack, with a `webpack` config and no `turbopack` config.
This may be a mistake.

原因

Next.js 16ではTurbopackがデフォルトで有効 になりました。
そのため、next.config.mjsにwebpackのカスタム設定がある場合、明示的にturbopackの設定を追加しないとエラーが出るようです。

解決方法

next.config.mjsにturbopack: {}を追加することで、エラーは解消されました。

変更前

const nextConfig = {
  // ... 既存の設定
  webpack: (config, { isServer }) => {
    // ... 既存のwebpack設定
  },
};

変更後

const nextConfig = {
  // ... 既存の設定
  turbopack: {}, // 追加
  webpack: (config, { isServer }) => {
    // ... 既存のwebpack設定
  },
};

turbopackに特別な設定をしていなくても、空オブジェクトを定義するだけで問題ありません。

終わりに

今後もアップデート時には公式ドキュメントや変更点を確認しながら、対応していきたいと思います。

参考