exportPathMap (Deprecated)
This feature is exclusive to
next export
and currently deprecated in favor ofgetStaticPaths
withpages
orgenerateStaticParams
withapp
.
Examples
exportPathMap
allows you to specify a mapping of request paths to page destinations, to be used during export. Paths defined in exportPathMap
will also be available when using next dev
.
Let's start with an example, to create a custom exportPathMap
for an app with the following pages:
pages/index.js
pages/about.js
pages/post.js
Open next.config.js
and add the following exportPathMap
config:
module.exports = {
exportPathMap: async function (
defaultPathMap,
{ dev, dir, outDir, distDir, buildId }
) {
return {
'/': { page: '/' },
'/about': { page: '/about' },
'/p/hello-nextjs': { page: '/post', query: { title: 'hello-nextjs' } },
'/p/learn-nextjs': { page: '/post', query: { title: 'learn-nextjs' } },
'/p/deploy-nextjs': { page: '/post', query: { title: 'deploy-nextjs' } },
}
},
}
Good to know: the
query
field inexportPathMap
cannot be used with automatically statically optimized pages orgetStaticProps
pages as they are rendered to HTML files at build-time and additional query information cannot be provided duringnext export
.
The pages will then be exported as HTML files, for example, /about
will become /about.html
.
exportPathMap
is an async
function that receives 2 arguments: the first one is defaultPathMap
, which is the default map used by Next.js. The second argument is an object with:
dev
-true
whenexportPathMap
is being called in development.false
when runningnext export
. In developmentexportPathMap
is used to define routes.dir
- Absolute path to the project directoryoutDir
- Absolute path to theout/
directory (configurable with-o
). Whendev
istrue
the value ofoutDir
will benull
.distDir
- Absolute path to the.next/
directory (configurable with thedistDir
config)buildId
- The generated build id
The returned object is a map of pages where the key
is the pathname
and the value
is an object that accepts the following fields:
page
:String
- the page inside thepages
directory to renderquery
:Object
- thequery
object passed togetInitialProps
when prerendering. Defaults to{}
The exported
pathname
can also be a filename (for example,/readme.md
), but you may need to set theContent-Type
header totext/html
when serving its content if it is different than.html
.
Adding a trailing slash
It is possible to configure Next.js to export pages as index.html
files and require trailing slashes, /about
becomes /about/index.html
and is routable via /about/
. This was the default behavior prior to Next.js 9.
To switch back and add a trailing slash, open next.config.js
and enable the trailingSlash
config:
module.exports = {
trailingSlash: true,
}
Customizing the output directory
next export
will use out
as the default output directory, you can customize this using the -o
argument, like so:
next export -o outdir
Warning: Using
exportPathMap
is deprecated and is overridden bygetStaticPaths
insidepages
. We don't recommend using them together.
Was this helpful?