{"id":159,"hash":"0b7b76c60b5ad137fc72321d5cebe3530f3dd4af32bf2218b55b32964b0225d9","pattern":"Got an error Invalid src prop (&#39;here is a link&#39;) on `next/image`, hostname &quot;localhost&quot; is not configured under images in your `next.config.js`","full_message":"I am using the Image component from Next.js (it's a new feature of Next.js). I've tried to give the source URL:\n\n{`${API}/user/photo/${blog.postedBy.username}`}\n\nBut it shows me this error. I also make changes in my next.config.js as\n\nmodule.exports = {\n    images: {\n      domains: ['localhost'],\n    },\n  }\n\nbut nothing works for me. Please help if you know anything about this.","ecosystem":"npm","package_name":"reactjs","package_version":null,"solution":"Yes, I finally got the answer. Make loader function to load it from the destination of the image.\n\nconst myLoader=({src})=>{\n  return `${API}/user/photo/${blog.postedBy.username}`;\n}\n\nUse this loader function the loader attribute of an Image tag.\n\n<Image loader={myLoader} src={`${API}/user/photo/${blog.postedBy.username}`} width={500}\n    height={500}/>\n\nThis works for me perfectly","confidence":0.95,"source":"stackoverflow","source_url":"https://stackoverflow.com/questions/64909447/got-an-error-invalid-src-prop-here-is-a-link-on-next-image-hostname-loca","votes":65,"created_at":"2026-04-19T04:41:25.075521+00:00","updated_at":"2026-04-19T04:51:06.847544+00:00"}