next.jsnext-images

Invalid src prop ({REDACTED URL}) on 'next/image', hostname is not configured under images in your 'next.config.js'

I started to get this error even though cdn domain was correctly configured in next.config.js.

After searching for couple hours with no answer, So I'm posting the answer below for future reference.

Solution

  • I found it here next-docs

    All you have to do is change module export to async function described in the docs.

    module.exports = async (phase, { defaultConfig }) => {
  /**
   * @type {import('next').NextConfig}
   */
  const nextConfig = {
    /* config options here */
    images: {
      domains: ['***your domains here***'],
    },
  };

  return nextConfig;
};