tanstack-react-router_installation

Install and configure TanStack Router for file-based routing in React projects.

Updated Aug 27, 2026

Search Tags:#cli #setup #vite #installation #esbuild #react-router #tanstack-router

Ready to run

npx skills add https://github.com/mathfalcon/revendiste --skill tanstack-react-router-installation

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: tanstack-react-router_installation
Source: https://github.com/mathfalcon/revendiste/tree/main/.cursor/skills/tanstack-react-router_installation
Command: npx skills add https://github.com/mathfalcon/revendiste --skill tanstack-react-router-installation

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill provides a clear, reproducible setup for adding TanStack Router to a React project, enabling file-based routing with bundler-compatible integration and developer tooling.

Core Features & Use Cases

Bundler-agnostic setup: Install core router packages and optional tooling for Vite, Esbuild, Rspack, and the Router CLI to support file-based routing from the start.
Plugin integration: Configure the Vite/Rust-like plugin (tanstackRouter) to enable automatic route generation and devtools during development.
Quick project bootstrap: Create initial route files like __root.tsx, index.tsx, and other files to bootstrap a file-based routing structure.

Quick Start

Install the core packages, configure the Vite plugin as shown, and create the initial route files to bootstrap a TanStack Router-powered React project.

Frequently Asked Questions about tanstack-react-router_installation

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I install TanStack Router in a React project using Vite?▼

To install TanStack Router in a React project, add the core packages @tanstack/react-router and @tanstack/react-router-devtools, then configure the tanstackRouter Vite plugin to enable automatic route generation and developer tooling during development.

Can I set up TanStack Router file-based routing with Esbuild or Rspack?▼

Yes, TanStack Router setup supports bundler-agnostic configuration across Vite, Esbuild, and Rspack. You can integrate the necessary plugins to enable file-based routing and automatic route generation regardless of your chosen bundler.

What packages do I need to configure TanStack Router for file-based routing?▼

Configuring TanStack Router for file-based routing requires the @tanstack/react-router package, the @tanstack/react-router-devtools package, and the optional @tanstack/router-plugin to enable automatic route generation in your Node.js environment.

How do I bootstrap initial route files when adding TanStack Router?▼

To bootstrap a TanStack Router file-based routing structure, create initial route files such as __root.tsx and index.tsx in your routes directory after configuring the bundler plugin to automatically generate the route tree.

Do I need the Router CLI to enable file-based routing in TanStack Router?▼

You do not strictly need the Router CLI to enable file-based routing, as the @tanstack/router-plugin can integrate directly with bundlers like Vite and Esbuild, but the CLI provides an alternative setup pathway for generating routes.