Tanstack Router

TanStack Router Skill

Build type-safe, file-based routing for React SPAs with TanStack Router, optimized for Cloudflare Workers deployment.

---

When to Use This Skill

Auto-triggers when you mention:

• "TanStack Router" or "type-safe routing"
• "file-based routing" or "route configuration"
• "React routing" with TypeScript emphasis
• "route loaders" or "data loading in routes"
• "Cloudflare Workers routing"

Use this skill when:

• Building SPAs with type-safe navigation
• Implementing file-based routing (like Next.js)
• Need route-level data loading
• Integrating routing with TanStack Query
• Deploying to Cloudflare Workers
• Want better TypeScript support than React Router

---

Quick Start

Installation

bun add @tanstack/react-router @tanstack/router-devtools
bun add -d @tanstack/router-plugin

Latest version: v1.170.18 (verified 2026-08-03)

Vite Configuration

// vite.config.ts
import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'
import { TanStackRouterVite } from '@tanstack/router-plugin/vite'