skills.rest
abereghici
abereghiciCOMMUNITY
Explore all skills by this author →
Website𝕏@alexandrubrgGitHub

router-plugin

Generate routes and automatic code splitting for TanStack Router projects.

Updated Apr 2, 2026
Search Tags:#routing#router#webpack#vite#esbuild#code-splitting
One-click install
npx skills add https://github.com/abereghici/skills --skill router-plugin-abereghici
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: router-plugin
Source: https://github.com/abereghici/skills/tree/main/vendor/tanstack-router/packages/router-plugin/skills/router-plugin
Command: npx skills add https://github.com/abereghici/skills --skill router-plugin-abereghici

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

TanStack Router bundler plugin for route generation and automatic code splitting. Configures autoCodeSplitting, routesDirectory, target framework, and code split groupings.

Core Features & Use Cases

  • File-based routing
  • Automatic code splitting across Vite, Webpack, Rspack, and esbuild
  • Consistent plugin ordering and configurable defaults to ensure reliable route generation

Quick Start

Install the plugin and configure it in your Vite/Webpack/Rspack/esbuild setup 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 automatic code splitting for TanStack Router?▼

Automatic code splitting for TanStack Router is configured by installing a bundler plugin that manages route generation and split groupings. It requires explicit configuration of target, routesDirectory, and generatedRouteTree to ensure deterministic builds.

Does the TanStack Router code splitting plugin work with Vite and Webpack?▼

Yes, the TanStack Router code splitting plugin works with Vite, Webpack, Rspack, and esbuild setups. It applies consistent plugin ordering and configurable defaults to ensure reliable file-based route generation across these bundlers.

Can I use file-based routing with Solid or Vue in TanStack Router?▼

File-based routing in TanStack Router supports React, Solid, and Vue ecosystems. You must explicitly configure the target framework alongside routesDirectory and generatedRouteTree to generate the correct route tree.

What is automatic code splitting in a file-based routing setup?▼

Automatic code splitting in a file-based routing setup is the process of dividing bundle code into groupings based on route definitions. The plugin automates this by reading the routesDirectory and applying split configurations during the build.

Why does my TanStack Router build fail without explicit route configuration?▼

TanStack Router builds require deterministic outputs, meaning the plugin needs explicit configuration of target, routesDirectory, and generatedRouteTree. Omitting these settings prevents the plugin from reliably generating the route tree.

Related Skills

Explore More Software Engineering Skills→
lespacemanlespaceman
4

router-plugin

Automate file-based routing and code splitting for TanStack Router across Vite, Webpack, Rspack, and esbuild.

Community
Intermediate
jezwebjezweb
961

TanStack Router

Generate typed file-based routes with TanStack Router for React SPAs.

Community
Intermediate
nklischnklisch
7

tanstack-router-v1

Reference TanStack Router v1 APIs for file-based routing and navigation.

Community
Basic
cill-i-amcill-i-am

router-core/code-splitting

Configure automatic and manual code splitting for TanStack Router routes.

Community
Intermediate