exportPathMap
此功能仅适用于
next export
,目前已弃用,推荐在pages
中使用getStaticPaths
或在app
中使用generateStaticParams
。
exportPathMap
允许您指定请求路径到页面目标的映射关系,供导出时使用。在 next dev
中使用时,exportPathMap
中定义的路径同样有效。
让我们从一个示例开始,为包含以下页面的应用创建自定义 exportPathMap
:
pages/index.js
pages/about.js
pages/post.js
打开 next.config.js
并添加以下 exportPathMap
配置:
须知:
exportPathMap
中的query
字段不能与自动静态优化页面或getStaticProps
页面一起使用,因为这些页面在构建时会被渲染为 HTML 文件,无法在next export
期间提供额外的查询信息。
这些页面随后将被导出为 HTML 文件,例如 /about
会变成 /about.html
。
exportPathMap
是一个异步函数,接收 2 个参数:第一个是 defaultPathMap
,即 Next.js 使用的默认映射;第二个是一个包含以下属性的对象:
dev
- 当exportPathMap
在开发环境中调用时为true
,运行next export
时为false
。在开发环境中,exportPathMap
用于定义路由。dir
- 项目目录的绝对路径outDir
-out/
目录的绝对路径(可通过-o
配置)。当dev
为true
时,outDir
的值为null
。distDir
-.next/
目录的绝对路径(可通过distDir
配置)buildId
- 生成的构建 ID
返回的对象是一个页面映射,其中 key
是 pathname
,value
是一个包含以下字段的对象:
page
:String
- 要渲染的pages
目录中的页面query
:Object
- 预渲染时传递给getInitialProps
的query
对象,默认为{}
导出的
pathname
也可以是文件名(例如/readme.md
),但如果其内容类型不是.html
,您可能需要在提供内容时将Content-Type
标头设置为text/html
。
添加尾部斜杠
可以配置 Next.js 将页面导出为 index.html
文件并要求尾部斜杠,例如 /about
会变成 /about/index.html
,并通过 /about/
可路由。这是 Next.js 9 之前的默认行为。
要恢复此行为并添加尾部斜杠,请打开 next.config.js
并启用 trailingSlash
配置:
自定义输出目录
next export
默认使用 out
作为输出目录,您可以使用 -o
参数自定义目录,如下所示:
警告:使用
exportPathMap
已被弃用,会被pages
中的getStaticPaths
覆盖。我们不建议同时使用它们。