exportPathMap

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

exportPathMap ermöglicht es Ihnen, eine Zuordnung von Anfragepfaden zu Seitenzielen anzugeben, die während des Exports verwendet werden soll. 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' } },
    }
  },
}

Gut zu wissen: Das query-Feld in exportPathMap kann nicht mit automatisch statisch optimierten Seiten oder getStaticProps-Seiten verwendet werden, da diese zur Build-Zeit 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 empfängt: 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 erforderlich sind. /about wird dann 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,
}

Anpassung 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 innerhalb von pages überschrieben. Wir empfehlen nicht, sie gemeinsam zu verwenden.