Next.js Discord

Discord Forum

Image component's remotePattern

Unanswered
English Shepherd posted this in #help-forum
Open in Discord
English ShepherdOP
When I use the Image component to display image I get an error saying:
"Invalid src prop (https://www.gutenberg.org/cache/epub/84/pg84.cover.medium.jpg) on next/image, hostname "www.gutenberg.org" is not configured under images in your next.config.js
See more info: https://nextjs.org/docs/messages/next-image-unconfigured-host"

And when I do what it says I should do in the "see more info" document my server stops working and I get the error that is shown in the attached screenshot. How can I fix it?

5 Replies

Longtail tuna
you can't use module.exports in module
@Longtail tuna you can't use `module.exports` in module
English ShepherdOP
Where am I supposed to use it?
American Crocodile
const nextConfig = {
    cacheComponents: true,
    typedRoutes: true,
    images: {
        remotePatterns: [
            {
                protocol: 'https',
                hostname: `${process.env.NEXT_PUBLIC_BLOB_STORE}`,
                port: '',
                pathname: '/**',
            },
            {
                protocol: 'https',
                hostname: 'tanstack.com',
                port: '',
                pathname: '/**',
            },
        ],
    },
}

export default nextConfig
American Crocodile
Np hommie