tanstack-router

Original：🇺🇸 English

Translated

Type-safe routing guidance for navigation, URL state, data loading, authentication, SSR, and framework adapters. Use when a project uses TanStack Router or when the task needs its setup, implementation, debugging, testing, migration, or integration guidance.

3installs

Sourcelukasa1993/tanstack-skills-extracted

Added on2026-10-04

NPX Install

npx skill4agent add lukasa1993/tanstack-skills-extracted tanstack-router

SKILL.md Content

View Translation Comparison →

TanStack Router

Type-safe routing guidance for navigation, URL state, data loading, authentication, SSR, and framework adapters.

Workflow

Inspect installed TanStack packages and exact versions.
Read the foundation reference and the adapter reference for the detected framework.
Topic references are indexes. Choose one guide or section for the task; follow its prerequisite links only when needed.
Prefer installed package types and version-matched source guidance over memory.
Preserve headless/core behavior when translating examples to a framework adapter.

Task routing

Foundations — Router construction and type-safety.
URLs and navigation — Path parameters, search parameters, and navigation.
Data, authentication, and errors — Data loading, guards, not-found, and error boundaries.
SSR and build tooling — SSR, code splitting, route generation, and build plugins.
Solid adapter — Solid Router adapter guidance.
Vue adapter — Vue Router adapter guidance.

Framework routing

React — detect
```
@tanstack/react-router
```
. Read Foundations. Shared guidance; check adapter-specific differences.
Solid — detect
```
@tanstack/solid-router
```
. Read Solid adapter.
Vue — detect
```
@tanstack/vue-router
```
. Read Vue adapter.

Product boundaries

Use these separate product skills when the task crosses their boundary:

tanstack-start

,

tanstack-query

.

See source provenance for exact upstream inputs and deduplication records.