Next.jsのデプロイでTypeError: Cannot destructure property 'customConfig'エラーが出る

はじめに

Next.jsでエラーが発生して突然デプロイできなくなり、ネットに情報がまったくなかったのでまとめていきます

問題

Firebaseにデプロイすると以下のエラーが出ました
ローカルではうまく動いています

[debug] [2024-03-10T04:25:11.395Z] TypeError: Cannot destructure property 'customConfig' of '(intermediate value)(intermediate value)(intermediate value)' as it is null.
    at loadConfig (/home/watanabejin/workspace/myblog/node_modules/next/dist/server/config.js:646:41)
    at getConfig (/usr/local/lib/node_modules/firebase-tools/lib/frameworks/next/index.js:390:28)
    at build (/usr/local/lib/node_modules/firebase-tools/lib/frameworks/next/index.js:67:65)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async prepareFrameworks (/usr/local/lib/node_modules/firebase-tools/lib/frameworks/index.js:216:33)
    at async deploy (/usr/local/lib/node_modules/firebase-tools/lib/deploy/index.js:55:13)

解決方法

next.config.jsに問題が有りました

next.config.js

module.exports = {
  images: {
    remotePatterns: [
      {
        protocol: "https",
        hostname: "qiita-user-contents.imgix.net",
      },
      {
        protocol: "https",
        hostname: "images.microcms-assets.io",
      },
    ],
  },
  reactStrictMode: false,
};

これをnext.config.mjsにして以下のように書くことでうまく生きました

next.config.mjs

/** @type {import('next').NextConfig} */
const nextConfig = {
  images: {
    remotePatterns: [
      {
        protocol: "https",
        hostname: "images.microcms-assets.io",
      },
    ],
  },
  reactStrictMode: false,
};

export default nextConfig;

おわりに

なんとか原因がわかってよかったです。あまりネットに情報がないエラーを解決すると嬉しいです