Reactjs 在“下一个/image”和“hostname”上获取了一个无效的src prop（'；这里是一个链接'；）错误；“本地主机”；未在“next.config.js”中的“图像”下配置`

我正在使用Next.js中的

Image

组件（这是Next.js的一个新特性）。我已尝试提供源URL：

{`${API}/user/photo/${blog.postedBy.username}`}

但它告诉我这个错误。我也在我的

next.config.js

中做了更改

module.exports = {
    images: {
      domains: ['localhost'],
    },
  }

---

但对我来说什么都不管用。如果您对此有所了解，请提供帮助。

我也遇到过同样的问题，您需要重新启动开发服务器，每次更改

next.config.js

文件时都需要这样做

API字符串应包括端口。e、 g.

localhost:3001

从“下一个/Image”导入图像；
import Image from "next/image";


<Image
    src="image path"
    alt="Picture of the author"
    width={500}
    height={500}
  />

在公用文件夹中添加图像，然后给出src的路径，例如src=“/imageName.jpg”

---

加上宽度和高度

是的，我终于得到了答案。使loader函数从图像的目标加载它

const myLoader=({src})=>{
  return `${API}/user/photo/${blog.postedBy.username}`;
}

使用此加载器函数可以更改图像标记的加载器属性

<Image loader={myLoader} src={`${API}/user/photo/${blog.postedBy.username}`} width={500}
    height={500}/>

---

这对我来说非常有效

const src=

${API}/user/photo/${blog.postedBy.username}

---

src}src={src}宽度={500}高度={500}/>

什么

API

？是本地主机吗？是的，是本地主机sahi bole ho！！真管用！我们还可以使用

src

参数，使其更加灵活：

constmyloader=（{src}）=>`${API}${src}`

请务必使用文本格式工具。