src-Verzeichnis

Als Alternative zur Platzierung der speziellen Next.js-Verzeichnisse app oder pages im Stammverzeichnis Ihres Projekts unterstützt Next.js auch das gängige Muster, Anwendungscode im src-Verzeichnis abzulegen.

Dies trennt Anwendungscode von Projektkonfigurationsdateien, die sich meist im Stammverzeichnis eines Projekts befinden, was von einigen Personen und Teams bevorzugt wird.

Um das src-Verzeichnis zu verwenden, verschieben Sie den app-Router-Ordner oder den pages-Router-Ordner nach src/app bzw. src/pages.

Ein Beispiel für eine Ordnerstruktur mit dem `src`-Verzeichnis

Gut zu wissen

  • Das /public-Verzeichnis sollte im Stammverzeichnis Ihres Projekts verbleiben.
  • Konfigurationsdateien wie package.json, next.config.js und tsconfig.json sollten im Stammverzeichnis Ihres Projekts verbleiben.
  • .env.*-Dateien sollten im Stammverzeichnis Ihres Projekts verbleiben.
  • src/app oder src/pages werden ignoriert, wenn app oder pages im Stammverzeichnis vorhanden sind.
  • Wenn Sie src verwenden, werden Sie wahrscheinlich auch andere Anwendungsordner wie /components oder /lib verschieben.
  • Wenn Sie Middleware verwenden, stellen Sie sicher, dass sie sich im src-Verzeichnis befindet.
  • Wenn Sie Tailwind CSS verwenden, müssen Sie in der Content-Sektion der tailwind.config.js-Datei das Präfix /src hinzufügen.
  • Wenn Sie TypeScript-Pfade für Importe wie @/* verwenden, sollten Sie das paths-Objekt in tsconfig.json aktualisieren, um src/ einzubeziehen.