Home / Snippets / How to Configure Next.Js Image Hostname
How to Configure Next.Js Image Hostname cover

How to Configure Next.Js Image Hostname

1.9K

1 year ago

0 comments

In this short snippet you will learn how to prevent “Error: Invalid src prop” in Next Js. Let's get started!

Open next.config.js and add it in the ”images” config

Add the domain section for your backend / image domain server
/** @type {import('next').NextConfig} */
const nextConfig = {
    images: { domains: ['assets.example.com'], },
}

module.exports = nextConfig
Once you have done so restart the server and you should be able to see the image.
notion avatar

Ahmad Aziz

Week-end developer currently experimenting with web, mobile, and all things programming.

Topics:

Frontend

Resource

Average

Average

Support Us

If you like our tutorial, support us by being our Patreon or buy us some coffee ☕️

Post Tutorials

Learn trending tutorials for ReactJs, React Native, VueJS, NextJs, Laravel, Tailwind CSS, and Flutter development.
View Tutorials

Code Components

Collection of Tailwind CSS components for everyone to use. Browse all of the components that's right for your web projects
View Components

Welcome to PostSrc V3

PostSrc Dark Logo

You have to login to favorite this