Prompt Buddy logoPrompt Buddy

tanstack · TanStack Router Docs

TanStack Router

Set up and initialize TanStack Router by configuring the router instance, managing route trees, and implementing file-based routing for React or Solid applications.

Import to Prompt Buddy

Derived skill

Files assembled from official documentation

Viewing SKILL.md

TanStack Router

Set up and initialize TanStack Router by configuring the router instance, managing route trees, and implementing file-based routing for React or Solid applications.

When To Use

Use when you need to scaffold a new project, initialize a router instance with TypeScript type safety, or set up file-based routing and 404 fallback routes.

Reference Files

FileContainsUse For
SKILL.mdEntry point: scope, routing table, and workflow.Start here.
docs/isnotfound-true-router-latest-docs-framework-react-guide-file-based-rout/workflow-guide.mdA guide explaining file-based routing implementation within the TanStack Router React framework.Questions about a guide explaining file-based routing implementation within the TanStack Router React framework.
docs/isnotfound-true-router-latest-docs-framework-react-guide-search-params/workflow-guide.mdA guide explaining how to manage and utilize search parameters within the TanStack Router React framework.Questions about a guide explaining how to manage and utilize search parameters within the TanStack Router React framework.
docs/creating-a-router-latest-docs-guide/workflow-guide.mdA guide explaining how to instantiate a router instance, manage the route tree, and configure the createRouter function in TanStack Router.Questions about a guide explaining how to instantiate a router instance, manage the route tree, and configure the createRouter functi...
examples/creating-a-router-latest-docs-guide/tanstack-router-tsx-create-router.tsxA TypeScript React example demonstrating how to initialize a new router instance using the createRouter function.Exact payloads, commands, or snippets shown in A TypeScript React example demonstrating how to initialize a new router instance using the createRouter function.
examples/creating-a-router-latest-docs-guide/tanstack-router-tsx-create-router-2.tsxA TypeScript React example demonstrating how to initialize a router instance using the createRouter function.Exact payloads, commands, or snippets shown in A TypeScript React example demonstrating how to initialize a router instance using the createRouter function.
examples/creating-a-router-latest-docs-guide/tanstack-router-tsx-create-router-3.tsxA TypeScript React example demonstrating how to initialize a new router instance using a generated route tree.Exact payloads, commands, or snippets shown in A TypeScript React example demonstrating how to initialize a new router instance using a generated route tree.
examples/creating-a-router-latest-docs-guide/tanstack-router-tsx-create-router-4.tsxA TypeScript React example demonstrating how to instantiate a router instance using a route tree.Exact payloads, commands, or snippets shown in A TypeScript React example demonstrating how to instantiate a router instance using a route tree.
examples/creating-a-router-latest-docs-guide/tanstack-router-tsx-create-router-implementation.tsxA TypeScript React implementation demonstrating how to declare the router module and initialize a new router instance.Exact payloads, commands, or snippets shown in A TypeScript React implementation demonstrating how to declare the router module and initialize a new router instance.
examples/creating-a-router-latest-docs-guide/tanstack-router-tsx-create-router-implementation-2.tsxA TypeScript React example demonstrating how to declare the router module and initialize a new router instance.Exact payloads, commands, or snippets shown in A TypeScript React example demonstrating how to declare the router module and initialize a new router instance.
examples/creating-a-router-latest-docs-guide/tanstack-router-tsx-create-root-route.tsxA TypeScript React example demonstrating how to initialize a router instance using createRootRoute and define a root route component.Exact payloads, commands, or snippets shown in A TypeScript React example demonstrating how to initialize a router instance using createRootRoute and define a root...
docs/quick-start-router-latest-docs/workflow-guide.mdA guide covering project scaffolding, routing options, and file-based vs code-based route configuration for TanStack Router.Questions about a guide covering project scaffolding, routing options, and file-based vs code-based route configuration for TanStack...
examples/quick-start-router-latest-docs/tanstack-router-quick-start-dependencies.jsonA JSON object containing the required npm dependencies for a TanStack Router quick start installation.Exact payloads, commands, or snippets shown in A JSON object containing the required npm dependencies for a TanStack Router quick start installation.
examples/quick-start-router-latest-docs/tanstack-router-quick-start-dependencies-2.jsonA JSON object containing the required package dependencies for a TanStack Router quick start installation.Exact payloads, commands, or snippets shown in A JSON object containing the required package dependencies for a TanStack Router quick start installation.

What This Skill Covers

  • {"isNotFound":true}: See the attached documentation page for this topic.
  • {"isNotFound":true}: See the attached documentation page for this topic.
  • Creating a Router: When you're ready to start using your router, you'll need to create a new Router instance. The router instance is the core brains of TanStack Router and is r...
  • Quick Start: The fastest way to get started with TanStack Router is to scaffold a new project. Just run:

Workflow

  1. Start with the reference file that matches the question.
  2. Prefer the most relevant file under docs/ for exact instructions and prose guidance.
  3. Use schemas/ and examples/ for exact contracts, payloads, manifests, requests, and snippets.
  4. Do not add behavior or configuration that is not present in the attached source files.

Canonical Sources