vue-router

Provide Vue 3 bindings for TanStack Router with typed routing and composables.

Updated Apr 2, 2026
One-click install
npx skills add https://github.com/abereghici/skills --skill vue-router-abereghici
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: vue-router
Source: https://github.com/abereghici/skills/tree/main/vendor/tanstack-router/packages/vue-router/skills/vue-router
Command: npx skills add https://github.com/abereghici/skills --skill vue-router-abereghici

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Vue developers need a typed, cohesive integration with TanStack Router to manage routes, components, and navigation while ensuring type-safety across the app.

Core Features & Use Cases

  • Vue bindings for TanStack Router including RouterProvider, Link, Outlet, Navigate, and composables like useRouter, useParams, useLoaderData.
  • Type-safe route definitions and file-based routing patterns for scalable SPA and SSR setups.
  • Use cases include building dynamic, strongly-typed routes in Vue 3 projects, improving developer experience and reducing runtime errors.

Quick Start

Install @tanstack/vue-router and configure it in your Vue app to start building typed, client-first routes.

Frequently Asked Questions about vue-router

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

FAQPage Schema
How do I set up typed routing in a Vue 3 SPA?▼

You can achieve typed Vue routing by installing @tanstack/vue-router and configuring the RouterProvider. This provides type-safe route definitions and composables like useRouter for scalable SPA setups.

Does TanStack Router support SSR patterns for Vue applications?▼

Yes, TanStack Router supports SSR-compatible patterns for Vue applications. The Vue bindings provide type-safe route definitions and composables that integrate directly into server-side rendering workflows.

What composables are available for type-safe Vue routing?▼

Available composables include useRouter, useParams, and useLoaderData. These Vue bindings allow you to access route context, parameters, and loaded data while maintaining strict type safety across components.

Can I use file-based routing patterns with Vue 3 and TanStack Router?▼

Yes, file-based routing patterns are supported. The TanStack Vue Router integration provides type-safe route definitions derived from your file structure, streamlining scalable SPA and SSR setups.

What components are included for Vue navigation in TanStack Router?▼

The Vue bindings include RouterProvider, Link, and Outlet components for rendering typed routes. These elements handle client-side navigation and component rendering while preserving type safety.