Next.js Discord

Discord Forum

Next js production images not showing with Image component.

Unanswered
Great black wasp posted this in #help-forum
Open in Discord
Great black waspOP
Hi, I am trying to build my next app.
The problem is that Image component shows images when working in dev build, but when i am building it with next build, it does not display images. Even local images are not displayed. What is the reason for that?
Next conf
const nextConfig = {
    experimental:{
        serverActions:false
    },
    images:{
    formats:['image/webp'],
        remotePatterns:[
            {
                protocol:'https',
                hostname:"cdn.discordapp.com"
            }
        ]
    },
    reactStrictMode:false,
    output:"export",
    
}

6 Replies

Carolina Dog
Can you show the code of the <Image /> component?
Great black waspOP
Sure
That is for local image
<Image
  width={50}
  height={50}
  src={"/logo.png"}
  alt={"Versy Logo"}/>

For external image
 <Image
  src={`https://cdn.discordapp.com/icons/${guild["id"]}/${guild["icon"]}`}
  alt={guild["name"] + "_icon"}
  width={100}
  height={100}
  className="rounded-full"
                  />
It works pretty well in dev mode
Carolina Dog
Where do you put the "/logo.png" image? Do you put it in public?
Great black waspOP
yes, but even public images are not loading. I specified in next config urls