Configurationnext.config.js OptionsexportPathMap

exportPathMap

この機能は next export 専用であり、現在 pages の getStaticPaths または app の generateStaticParams を使用するように 非推奨 となっています。

exportPathMap を使用すると、エクスポート時に使用されるリクエストパスからページへのマッピングを指定できます。exportPathMap で定義されたパスは、next dev を使用する場合にも利用できます。

以下のページを持つアプリのカスタム exportPathMap を作成するために、例から始めましょう。

pages/index.js
pages/about.js
pages/post.js

next.config.js を開いて、以下の exportPathMap 設定を追加してください。

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' } },
    }
  },
}

注意: exportPathMap の query フィールドは、ビルド時に HTML ファイルとしてレンダリングされ、next export 中に追加のクエリ情報を提供できない自動静的最適化ページまたは getStaticProps ページでは使用できません。

ページは HTML ファイルとしてエクスポートされます。たとえば、/about は /about.html になります。

exportPathMap は async 関数で、2 つの引数を受け取ります。最初の引数は Next.js が使用するデフォルトマップである defaultPathMap です。2 番目の引数は、以下のプロパティを持つオブジェクトです。

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）にすることもできますが、そのコンテンツをサーブする際に Content-Type ヘッダーを text/html に設定する必要がある場合があります。これは .html 以外の場合です。

末尾のスラッシュを追加する

Next.js を設定して、ページを index.html ファイルとしてエクスポートし、末尾にスラッシュを要求するようにできます。/about は /about/index.html になり、/about/ を介してルーティング可能になります。これは Next.js 9 より前のデフォルトの動作でした。

末尾のスラッシュに戻して追加するには、next.config.js を開いて trailingSlash 設定を有効にします。

module.exports = {
  trailingSlash: true,
}

出力ディレクトリのカスタマイズ

next export はデフォルトの出力ディレクトリとして out を使用します。これは、次のように -o 引数を使用してカスタマイズできます。

next export -o outdir

警告: exportPathMap の使用は非推奨であり、pages 内の getStaticPaths によってオーバーライドされます。これらを一緒に使用することは推奨しません。