Standardize Vue Router 4 routes, lazy loading, guards, and RouteMeta typing.
npx skills add https://github.com/CloudyWing/ai-dotfiles --skill vue-router-cloudywing
Please help me install this Agent Skill. Skill: vue-router Source: https://github.com/CloudyWing/ai-dotfiles/tree/main/skills/vue-router Command: npx skills add https://github.com/CloudyWing/ai-dotfiles --skill vue-router-cloudywing
Provides a clear, consistent set of rules and patterns for designing Vue Router 4 routes, navigation guards, lazy-loaded components, and type-safe route metadata so teams avoid oversized bundles, inconsistent navigation behavior, and runtime typing errors.
Apply the vue-router skill to review and refactor the project's router configuration to use dynamic imports, typed RouteMeta augmentation, consistent route naming, and appropriate navigation guards.
High-intent search queries and answers about installing and using this skill.
To enforce Vue Router 4 lazy loading and navigation guards consistently, standardize route definitions using dynamic imports for page components and apply prescribed global, route-level, or in-component guard patterns for secure auth flows.
The best way to type Vue Router RouteMeta in TypeScript is by augmenting the RouteMeta interface in a dedicated TypeScript file, ensuring correct parameter typing and conversion across your application.
Structure large Vue 3 route modules for code-splitting by enforcing dynamic imports for page components and organizing routes into modular files, ensuring predictable path kebab-case and PascalCase route names.
Yes, you can use Pinia state management with Vue Router navigation guards by applying prescribed safe Pinia usage patterns within global, route-level, or in-component guards to handle redirects and role-based access.
Yes, Vue Router 4 props function mode works with dynamic route parameters by allowing correct parameter typing and conversion, passing them as props to components for predictable and type-safe navigation behavior.
Standardize Vue Router route naming conventions across a project by enforcing path kebab-case, PascalCase route names, and consistent view filename conventions to keep route maps predictable and maintainable.
Muath2000Assist with Vue 3 Composition API and Nuxt 3 development.
TheOrcDevLazily load heavy UI components with next/dynamic and disabled SSR.
bingeli1379Apply Vue Router navigation guard patterns to enforce access control and lifecycle consistency.
xmun74Provides frontend architecture and coding standards for TanStack Query-based projects.
