如何在本地提供图像，而不是在下一个静态导出时使用在线url

Question

所以我有多个图像来自在线。但是当我开始下一个导出图像不包括在它和图像URL存储在线字符串所以我希望我的图像被导出并保存在本地而不是从在线API

我如何告诉next在本地存储图像并从本地提供而不是从在线url

Answer 1

恐怕下不知道怎么从网上下载图片。也许你应该下载它们并从你的电脑上提供。这样Next就会捆绑这些资源。

要做到这一点，将它们放在项目根目录的public目录中(例如public/my-image.png)，并像src="/my-image.png" 一样引用它们。

---

来自Next文档

Next.js可以提供静态文件，如图像，在名为根目录下的Public。然后可以公开文件你的代码从基础URL(/)开始引用

例如，如果您添加一个图像到public/me.png，下面的代码将访问图像:

import Image from 'next/image'
function Avatar() {
return <Image src="/me.png" alt="me" width="64" height="64" />
}
export default Avatar