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

Question

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`

Answer 1

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: '**',
      },
    ],
  },

Answer 2

Here is the solution. I am using Google Provider Next-Auth (authjs’s new name). In the hostname add your URL. For more details, visit Next/image un-configured Host.

images: {
    remotePatterns: [
      {
        protocol: 'https',
        hostname: 'lh3.googleusercontent.com',
        port: '',
        pathname: '/**',
      },
    ],