exportPathMap

Diese Funktion ist exklusiv für next export und derzeit veraltet zugunsten von getStaticPaths mit pages oder generateStaticParams mit app.

exportPathMap ermöglicht es Ihnen, eine Zuordnung von Anfragepfaden zu Zielseiten anzugeben, die während des Exports verwendet wird. Pfade, die in exportPathMap definiert sind, sind auch verfügbar, wenn next dev verwendet wird.

Beginnen wir mit einem Beispiel, um eine benutzerdefinierte exportPathMap für eine App mit den folgenden Seiten zu erstellen:

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

Öffnen Sie next.config.js und fügen Sie die folgende exportPathMap-Konfiguration hinzu:

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

Wissenswert: Das query-Feld in exportPathMap kann nicht mit automatisch statisch optimierten Seiten oder getStaticProps-Seiten verwendet werden, da diese zum Build-Zeitpunkt in HTML-Dateien gerendert werden und zusätzliche Abfrageinformationen während next export nicht bereitgestellt werden können.

Die Seiten werden dann als HTML-Dateien exportiert, zum Beispiel wird /about zu /about.html.

exportPathMap ist eine async-Funktion, die 2 Argumente erhält: Das erste ist defaultPathMap, die standardmäßige Zuordnung, die von Next.js verwendet wird. Das zweite Argument ist ein Objekt mit:

• dev - true, wenn exportPathMap in der Entwicklung aufgerufen wird. false beim Ausführen von next export. In der Entwicklung wird exportPathMap verwendet, um Routen zu definieren.
• dir - Absoluter Pfad zum Projektverzeichnis
• outDir - Absoluter Pfad zum out/-Verzeichnis (konfigurierbar mit -o). Wenn dev true ist, ist der Wert von outDir null.
• distDir - Absoluter Pfad zum .next/-Verzeichnis (konfigurierbar mit der distDir-Konfiguration)
• buildId - Die generierte Build-ID

Das zurückgegebene Objekt ist eine Zuordnung von Seiten, wobei der key der pathname ist und der value ein Objekt, das die folgenden Felder akzeptiert:

• page: String - die Seite im pages-Verzeichnis, die gerendert werden soll
• query: Object - das query-Objekt, das an getInitialProps übergeben wird, wenn vorgerendert wird. Standardmäßig {}

Der exportierte pathname kann auch ein Dateiname sein (zum Beispiel /readme.md), aber Sie müssen möglicherweise den Content-Type-Header auf text/html setzen, wenn der Inhalt anders als .html ist.

Hinzufügen eines nachgestellten Schrägstrichs

Es ist möglich, Next.js so zu konfigurieren, dass Seiten als index.html-Dateien exportiert werden und nachgestellte Schrägstriche erfordern, /about wird zu /about/index.html und ist über /about/ erreichbar. Dies war das Standardverhalten vor Next.js 9.

Um dies wieder zu aktivieren und einen nachgestellten Schrägstrich hinzuzufügen, öffnen Sie next.config.js und aktivieren Sie die trailingSlash-Konfiguration:

module.exports = {
  trailingSlash: true,
}

Anpassen des Ausgabeverzeichnisses

next export verwendet standardmäßig out als Ausgabeverzeichnis. Sie können dies mit dem -o-Argument anpassen, wie folgt:

next export -o outdir

Warnung: Die Verwendung von exportPathMap ist veraltet und wird durch getStaticPaths in pages überschrieben. Wir empfehlen nicht, sie zusammen zu verwenden.