Nextjs Image component complaining that the host is not added to config, but it is

Viewed 1862

I have a weeeeeeird issue with Nextjs, I have it connected to a cms (storyblok) and all images that I use come from that place. All images work just fine, but now I added a few new ones and I keep getting the error that the host is not configured, but it is!

Error:

Error: Invalid src prop (https://a.storyblok.com/f/130657/88x88/f37f10e611/giantstitanslogo.png) on `next/image`, hostname "a.storyblok.com" is not configured under images in your `next.config.js`
See more info: https://nextjs.org/docs/messages/next-image-unconfigured-host

Component, logoImg.filename is the src url:

      <Image
        src={logoImg.filename}
        alt={logoImg.alt}
        width={logoImgDimensions.width}
        height={logoImgDimensions.height}
        layout="responsive"
      />

And the config:

module.exports = {
  images: {
    domains: ["a.storyblok.com"],
  },
  experimental: { esmExternals: true },
};

Also if I do the following:

  1. Comment out the Image component and save
  2. Refresh
  3. Error is gone page loads
  4. Now uncomment the Image component and save (without refresh)
  5. The images show up just fine!
  6. Refresh -> error again
1 Answers
Related