next.jscloudinary

The "images.domains" configuration is deprecated. Please use "images.remotePatterns" configuration instead


I get the following warning in Next 14:

The "images.domains" configuration is deprecated. Please use "images.remotePatterns" configuration instead.

My next.config.js has this

images: {
  domains: ['res.cloudinary.com'],
  remotePatterns: [
    {
      protocol: "https",
      hostname: "**",
    },
  ],
}

If I remove domains from there, I get error:

`next/image`, hostname "res.cloudinary.com" is not configured under images in your `next.config.js`


Solution

  • In Next.js Version 14, domains configuration has been deprecated in favour of remotePatterns. This can be defined in the next.config.js file.

    Here is a reference as per the Next.js docs: remotePatterns

    In your snippet, after you remove the domains configuration as you have described, it seems that you have mixed up your values in remotePatterns configuration, because you have set the hostname value to the wildcard '**' instead of the actual hostname 'res.cloudinary.com', thus the error hostname "res.cloudinary.com" is not configured.

    Try to do this instead:

     images: {
        remotePatterns: [
          {
            protocol: 'https',
            hostname: 'res.cloudinary.com',
            pathname: '**',
          },
        ],
      },