introduction

next.js 能够提供静态文件,像图片,包含在根目录下的public目录下的都可以作为静态文件进行提供 … 并且这个目录下的文件引用以/基础URL开始 ..

举个例子,如果你想引用一个public/me.png,那么访问它通过

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

注意到使用next/image需要Next.js 10 或者之后 ..

对于robots.txt,favicon.ico等等都是有用的,Google 站点验证以及其他任何静态文件包括.html)!

public目录仅被用来提供静态资源服务 ..

pages目录中不应存在和静态文件相同的名称(这可能导致相同的路由从而引起歧义,而报错) ..

并且在public目录中的资源在build time 由next.js 进行处理,保管,在运行时增加的文件不可用,我们推荐使用第三方服务类似于AWS S3来持久化文件存储 …