Lang x Lang

exportPathMap (Deprecated)

この機能は next export 専用で、現在は getStaticPathspages または generateStaticParamsapp を優先するために非推奨となっています。

exportPathMapは、request paths をページの目的地にマッピングすることを指定でき、export の間に使用されます。Paths は、 next devを使用するときにもexportPathMapで定義されるものと同じく利用可能です。

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

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

next.config.jsを開き、次のexportPathMap config を追加してください:

next.config.js
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: exportPathMapqueryフィールドは、自動的に静的に最適化されたページgetStaticPropsページと一緒に使用することはできません。これらは build 時に HTML ファイルにレンダリングされ、追加の query 情報はnext export中に提供できません。

その後、ページは例えば、/about/about.html になるように、HTML ファイルとして export されます。

exportPathMapasync関数で、2 つの引数を受け取ります。最初の引数はdefaultPathMapで、これは Next.js が使用する default マップです。2 つ目の引数は以下の要素を持つ object です:

  • dev - exportPathMapが development で呼び出されているときはtruenext exportを実行しているときはfalse。 development では、exportPathMapは routes を定義するために使用されます。
  • dir - プロジェクトディレクトリへの絶対的な path
  • outDir - out/ ディレクトリへの絶対 path(-o設定可能)。 devtrueの場合、outDirの value はnullになります。
  • distDir - .next/ ディレクトリへの絶対 path(distDir config で設定可能)
  • buildId - 生成された build id

返される object は、keypathnameで、valueが以下のフィールドを受け入れる object であるページの map です。

  • page: String - pages ディレクトリ内のページを render します
  • query: Object - getInitialPropsにプレ rendering 時に渡されるquery object 。default は{}です。

export された pathname はファイ lename(例えば、/readme.md)も可能ですが、内容がそれが .html と異なる場合、その内容を提供する際に Content-Type header を text/html に設定する必要があるかもしれません

Adding a trailing slash

index.htmlファイルとしてページをエクスポートするように Next.js を設定することが可能であり、/about/about/index.htmlになり、/about/を介してルーティング可能になります。これは Next.js 9 より前の default の動作でした。

元に戻してトレーリングスラッシュを追加するには、next.config.js を開き、trailingSlash config を有効にします。

next.config.js
module.exports = {
  trailingSlash: true,
}

Customizing the output directory

next exportoutを default の出力ディレクトリとして使用します。これは-o引数を使用してカスタマイズすることができます。例えば、次のようになります:

Terminal
next export -o outdir

警告: exportPathMapの使用は非推奨であり、pages内のgetStaticPathsによって上書きされます。 これらを一緒に使用することはお勧めしません。

当社サイトでは、Cookie を使用しています。各規約をご確認の上ご利用ください:
Cookie Policy, Privacy Policy および Terms of Use