public 文件夹

Next.js 可以在根目录下的 public 文件夹中托管静态文件（如图片）。public 内的文件可以通过代码从基础 URL (/) 开始引用。

例如，文件 public/avatars/me.png 可以通过访问 /avatars/me.png 路径查看。显示该图片的代码可能如下：

avatar.js

import Image from 'next/image'

export function Avatar({ id, alt }) {
  return <Image src={`/avatars/${id}.png`} alt={alt} width="64" height="64" />
}

export function AvatarOfMe() {
  return <Avatar id="me" alt="A portrait of me" />
}

缓存机制

Next.js 无法安全地缓存 public 文件夹中的资源，因为它们可能会发生变化。默认应用的缓存头为：

Cache-Control: public, max-age=0

机器人协议、网站图标及其他

对于静态元数据文件，如 robots.txt、favicon.ico 等，您应使用 app 文件夹内的特殊元数据文件。

public 文件夹

缓存机制

机器人协议、网站图标及其他

On this page