File-Based Routing API Referenz

Das File-Based Routing von TanStack Router ist sehr flexibel und kann an die Bedürfnisse Ihres Projekts angepasst werden.

Die folgenden Optionen stehen zur Konfiguration des File-Based Routings zur Verfügung

• routesDirectory (erforderlich)
• generatedRouteTree (erforderlich)
• virtualRouteConfig
• routeFilePrefix
• routeFileIgnorePrefix
• routeFileIgnorePattern
• indexToken
• routeToken
• quoteStyle
• semicolons
• apiBase
• autoCodeSplitting
• disableTypes
• addExtensions
• disableLogging
• routeTreeFileHeader
• routeTreeFileFooter
• enableRouteTreeFormatting
• tmpDir

Dies ist der Pfad zum Verzeichnis, in dem sich die Routen-Dateien befinden, relativ zum cwd (current working directory).

Standardmäßig ist der Wert auf den folgenden gesetzt und kann nicht auf einen leeren String oder undefined gesetzt werden.

./src/routes

./src/routes

Dies ist der Pfad zur Datei, in der der generierte Routenbaum gespeichert wird, relativ zum cwd (current working directory).

Standardmäßig ist der Wert auf den folgenden gesetzt und kann nicht auf einen leeren String oder undefined gesetzt werden.

./src/routeTree.gen.ts

./src/routeTree.gen.ts

Wenn disableTypes auf true gesetzt ist, wird der generierte Routenbaum mit der .js-Erweiterung anstelle von .ts gespeichert.

Diese Option wird verwendet, um die Virtual File Routes Funktion zu konfigurieren. Weitere Informationen finden Sie im Leitfaden "Virtual File Routes".

Standardmäßig ist dieser Wert auf undefined gesetzt.

Diese Option wird verwendet, um Routen-Dateien im Routenverzeichnis zu identifizieren. Das bedeutet, dass nur Dateien, die mit diesem Präfix beginnen, für das Routing berücksichtigt werden.

Standardmäßig ist dieser Wert auf `` gesetzt und somit werden alle Dateien im Routenverzeichnis für das Routing berücksichtigt.

Diese Option wird verwendet, um bestimmte Dateien und Verzeichnisse im Routenverzeichnis zu ignorieren. Dies kann nützlich sein, wenn Sie bestimmte Dateien oder Verzeichnisse "opt-in" möchten, die nicht für das Routing berücksichtigt werden sollen.

Standardmäßig ist dieser Wert auf - gesetzt.

Wenn Sie diese Option verwenden, können Sie Strukturen wie diese erstellen, die es Ihnen ermöglichen, zusammengehörige Dateien, die keine Routen-Dateien sind, nebeneinander zu platzieren.

src/routes
├── posts
│   ├── -components  // Ignored
│   │   ├── Post.tsx
│   ├── index.tsx
│   ├── route.tsx

src/routes
├── posts
│   ├── -components  // Ignored
│   │   ├── Post.tsx
│   ├── index.tsx
│   ├── route.tsx

Diese Option wird verwendet, um bestimmte Dateien und Verzeichnisse im Routenverzeichnis zu ignorieren. Sie kann im regulären Ausdrucksformat verwendet werden. Zum Beispiel ignoriert .((css|const).ts)|test-page Dateien / Verzeichnisse mit Namen, die .css.ts, .const.ts oder test-page enthalten.

Standardmäßig ist dieser Wert auf undefined gesetzt.

Wie im Leitfaden Routing Concepts erwähnt, wird eine Layout-Route unter dem angegebenen Pfad gerendert und die Kind-Routen werden innerhalb der Layout-Route gerendert. Der routeToken wird verwendet, um die Layout-Routen-Datei im Routenverzeichnis zu identifizieren.

Standardmäßig ist dieser Wert auf route gesetzt.

🧠 Die folgenden Dateinamen entsprechen der gleichen Laufzeit-URL

src/routes/posts.tsx -> /posts
src/routes/posts.route.tsx -> /posts
src/routes/posts/route.tsx -> /posts

src/routes/posts.tsx -> /posts
src/routes/posts.route.tsx -> /posts
src/routes/posts/route.tsx -> /posts

Wie im Leitfaden Routing Concepts erwähnt, ist eine Index-Route eine Route, die übereinstimmt, wenn der URL-Pfad exakt mit dem übergeordneten Routenpfad übereinstimmt. Der indexToken wird verwendet, um die Index-Routen-Datei im Routenverzeichnis zu identifizieren.

Standardmäßig ist dieser Wert auf index gesetzt.

🧠 Die folgenden Dateinamen entsprechen der gleichen Laufzeit-URL

src/routes/posts.index.tsx -> /posts/
src/routes/posts/index.tsx -> /posts/

src/routes/posts.index.tsx -> /posts/
src/routes/posts/index.tsx -> /posts/

Wenn Ihr generierter Routenbaum erstellt wird und Sie zum ersten Mal eine neue Route erstellen, werden diese Dateien mit dem hier angegebenen Anführungszeichenstil formatiert.

Standardmäßig ist dieser Wert auf single gesetzt.

Wenn Ihr generierter Routenbaum erstellt wird und Sie zum ersten Mal eine neue Route erstellen, werden diese Dateien mit Semikolons formatiert, wenn diese Option auf true gesetzt ist.

Standardmäßig ist dieser Wert auf false gesetzt.

Diese Funktion ist nur verfügbar, wenn Sie das TanStack Router Bundler Plugin verwenden.

Diese Option wird verwendet, um das automatische Code-Splitting für nicht kritische Routenkonfigurationselemente zu aktivieren. Weitere Informationen finden Sie im Leitfaden "Automatische Code-Aufteilung".

Standardmäßig ist dieser Wert auf false gesetzt.

Diese Option wird verwendet, um die Generierung von Typen für den Routenbaum zu deaktivieren.

Wenn auf true gesetzt, enthält der generierte Routenbaum keine Typen und wird als .js-Datei anstelle einer .ts-Datei geschrieben.

Standardmäßig ist dieser Wert auf false gesetzt.

Diese Option fügt Dateierweiterungen zu den Routennamen im generierten Routenbaum hinzu.

Standardmäßig ist dieser Wert auf false gesetzt.

Diese Option schaltet die Konsolenprotokollierung für den Routengenerierungsprozess aus.

Standardmäßig ist dieser Wert auf false gesetzt.

Diese Option ermöglicht es Ihnen, Inhalt am Anfang der generierten Routenbaum-Datei einzufügen.

Standardmäßig ist dieser Wert auf

[
  "/* eslint-disable */",
  "// @ts-nocheck",
  "// noinspection JSUnusedGlobalSymbols"
]

[
  "/* eslint-disable */",
  "// @ts-nocheck",
  "// noinspection JSUnusedGlobalSymbols"
]

Diese Option ermöglicht es Ihnen, Inhalt am Ende der generierten Routenbaum-Datei anzuhängen.

Standardmäßig ist dieser Wert auf

[]

[]

Diese Option aktiviert die Formatierungsfunktion für die generierte Routenbaum-Datei, was bei großen Projekten zeitaufwändig sein kann.

Standardmäßig ist dieser Wert auf true gesetzt.

Atomare Dateischreibvorgänge (Routen-Dateien und die generierte Routenbaum-Datei) werden implementiert, indem zuerst eine temporäre Datei erstellt und dann in ihren tatsächlichen Speicherort umbenannt wird.

Diese Konfigurationsoption ermöglicht die Konfiguration des Pfads zum temporären Verzeichnis, das zum Erstellen dieser temporären Dateien verwendet wird. Wenn es sich um einen relativen Pfad handelt, wird er zum aktuellen Arbeitsverzeichnis aufgelöst. Wenn dieser Wert nicht gesetzt ist, wird process.env.TSR_TMP_DIR verwendet. Wenn process.env.TSR_TMP_DIR nicht gesetzt ist, wird standardmäßig .tanstack/tmp relativ zum aktuellen Arbeitsverzeichnis verwendet.