router-plugin

Generate route trees and automatic code splitting for TanStack Router projects.

Updated Aug 27, 2026
One-click install
npx skills add https://github.com/redacharf/fin-punk --skill router-plugin-redacharf
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: router-plugin
Source: https://github.com/redacharf/fin-punk/tree/main/.agents/skills/router-plugin
Command: npx skills add https://github.com/redacharf/fin-punk --skill router-plugin-redacharf

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

TanStack Router bundler plugin for route generation and automatic code splitting. It ensures correct plugin ordering and cross-bundler compatibility, enabling file-based routing with minimal configuration.

Core Features & Use Cases

  • File-based routing and automatic code splitting with support for Vite, Webpack, Rspack, and esbuild.
  • Keeps routing config centralized and predictable across projects.
  • Use case: when building large TanStack Router apps, this plugin streamlines route generation and code-splitting.

Quick Start

Install the plugin and place tanstackRouter in your Vite/Webpack/Rspack/esbuild config to enable file-based routing and automatic code splitting.

Frequently Asked Questions about router-plugin

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

FAQPage Schema
How do I set up file-based routing and automatic code splitting for TanStack Router?

To set up file-based routing and automatic code splitting for TanStack Router, install the router-plugin and place it in your Vite, Webpack, Rspack, or esbuild configuration to auto-generate route trees.

Does TanStack Router support bundlers other than Vite for route generation?

Yes, TanStack Router route generation supports Vite, Webpack, Rspack, and esbuild. The plugin ensures cross-bundler compatibility and correct plugin ordering for reliable route compilation across these environments.

What is the best way to manage large TanStack Router applications with predictable configurations?

The best way to manage large TanStack Router applications is using a bundler plugin to centralize routing configurations and automate code splitting, which keeps route generation predictable and improves performance.

Why does my TanStack Router code splitting not work correctly across different bundlers?

Code splitting may fail due to incorrect plugin ordering or incompatible bundler configurations. The plugin enforces correct plugin order and cross-bundler compatibility to ensure reliable route compilation.

When do I need automatic route tree generation for my web application?

You need automatic route tree generation when building large TanStack Router apps to streamline file-based routing. It minimizes manual configuration and ensures automatic code splitting for optimal performance.