hostname "127.0.0.1" is not configured under images in your `next.config.js`See more info: https://nextjs.org/docs/messages/next-image-unconfigured-host

Unhandled Runtime Error

Error: Invalid src prop (http://127.0.0.1:8020/api/files/background.jpg) on `next/image`, hostname "127.0.0.1" is not configured under images in your `next.config.js` See more info: https://nextjs.org/docs/messages/next-image-unconfigured-host

`next/image` Un-configured Host

 

Nextjs에서 Image를 사용할때 다이렉트로 src에 웹 이미지 url을 사용하면 위와 같은 에러가 뜬다.

 

[solution]

next.config.mjs 파일에서 nextConfig에 해당 도메인 값을 추가하면 된다.

/** @type {import('next').NextConfig} */
import * as path from "path"
const __dirname = path.resolve()
const nextConfig = {
    reactStrictMode: true,
    sassOptions: {
        includePaths: [path.join(__dirname, 'styles')],
    },
};

export default nextConfig;

 

위에서 밑에꺼 추가하면 된다.

images: {
    domains: ['127.0.0.1'],
}

반응형

domains 추가!

/** @type {import('next').NextConfig} */
import * as path from "path"
const __dirname = path.resolve()
const nextConfig = {
    reactStrictMode: true,
    sassOptions: {
        includePaths: [path.join(__dirname, 'styles')],
    },
    images: {
        domains: ['127.0.0.1'],
    }
};

export default nextConfig;