vue-router

When to use this skill

Use this skill whenever the user wants to:

• Configure routing in Vue 2 or Vue 3 projects
• Implement dynamic routes, nested routes, and named routes
• Set up navigation guards (beforeEach, beforeResolve, afterEach)
• Use programmatic navigation with router.push, router.replace
• Implement lazy-loaded routes for code splitting
• Handle route meta fields for permissions and layout control

How to use this skill

Workflow

1. Identify the Vue version (Vue 2 uses Vue Router 3.x, Vue 3 uses Vue Router 4.x)
2. Configure routes with the appropriate API
3. Add navigation guards for authentication and authorization
4. Implement lazy loading for large page components