TanStackOfficial·31 Agent Skills Included

router

Build type-safe React, Solid, and Vue apps with routing and SSR

Guides AI agents to build and migrate type-safe web apps with TanStack Router and TanStack Start. Covers routing, search params, data loading, auth guards, server functions, SSR, and deployment without wrong-framework mistakes. Prevents common errors like broken type inference, unprotected endpoints, and failed code splitting.

15,020|1,824

↗

npx skills add TanStack/router --all -g -y

Available:

Gives AI agents the monorepo layout, Nx testing commands, and execution guardrails needed to safely modify and verify TanStack Router packages.

All Skills in This Repository (31)

Pure Emerald Level Indicators

📦 In Repo

TanStack

start-server-core

Provide a server-side runtime for TanStack Start with request handling and session management.

virtual-file-routes

Build explicit route trees for TanStack Router projects.

router-core

Define type-safe route trees, loaders, and context for TanStack Router across React, Solid, and SSR.

router-core/data-loading

Implement TanStack Router data-loading patterns with loaders, loaderDeps, and deferred loading.

router-core/type-safety

Configure fully inferred types for TanStack Router applications without casts.

router-core/not-found-and-errors

Configure notFound() and errorComponent for TanStack Router routes.

router-core/navigation

Implement type-safe navigation with TanStack Router Link, useNavigate, and Navigate.

router-core/auth-and-guards

Protect routes with beforeLoad guards and RBAC in TanStack Router.

router-core/search-params

Validate TanStack Router search params with type-safe schemas and middlewares.

router-core/ssr

Configure non-streaming and streaming SSR for TanStack Router applications.

router-core/path-params

Parse dynamic, splat, and optional path params in TanStack Router routes.

router-core/code-splitting

Automate route code-splitting for TanStack Router with .lazy.tsx files.

Official

Advanced

Frequently Asked Questions

FAQPage Schema

How to install TanStack Router skills?▼

Run `npx skills add TanStack/router --all -g -y` in your terminal to install the full skill suite globally.

What do these TanStack Router skills do?▼

They teach your AI agent the correct patterns for routing, search params, data loading, auth, server functions, SSR, and deployment in TanStack Router and Start apps.

Can AI migrate my app from Next.js or React Router?▼

Yes. Dedicated migration skills walk the agent step by step through converting routes, links, loaders, and server actions to TanStack equivalents.

Do these skills work with React, Solid, and Vue?▼

Yes. The suite includes framework-specific skills for React, Solid, and Vue bindings of both Router and Start.

How do the skills prevent wrong-framework code?▼

Each skill lists critical mistakes and wrong imports, so the agent avoids generating Next.js, Remix, or react-router-dom patterns that break TanStack apps.