antfu / vue-router-best-practices
Install for your project team
Run this command in your project directory to install the skill for your entire team:
mkdir -p .claude/skills/vue-router-best-practices && curl -L -o skill.zip "https://fastmcp.me/Skills/Download/1896" && unzip -o skill.zip -d .claude/skills/vue-router-best-practices && rm skill.zipProject Skills
This skill will be saved in .claude/skills/vue-router-best-practices/ and checked into git. All team members will have access to it automatically.
Important: Please verify the skill by reviewing its instructions before using it.
Vue Router 4 patterns, navigation guards, route params, and route-component lifecycle interactions.
0 views
0 installs
Skill Content
--- name: vue-router-best-practices description: "Vue Router 4 patterns, navigation guards, route params, and route-component lifecycle interactions." version: 1.0.0 license: MIT author: github.com/vuejs-ai --- Vue Router best practices, common gotchas, and navigation patterns. ### Navigation Guards - Navigating between same route with different params → See [router-beforeenter-no-param-trigger](reference/router-beforeenter-no-param-trigger.md) - Accessing component instance in beforeRouteEnter guard → See [router-beforerouteenter-no-this](reference/router-beforerouteenter-no-this.md) - Navigation guard making API calls without awaiting → See [router-guard-async-await-pattern](reference/router-guard-async-await-pattern.md) - Users trapped in infinite redirect loops → See [router-navigation-guard-infinite-loop](reference/router-navigation-guard-infinite-loop.md) - Navigation guard using deprecated next() function → See [router-navigation-guard-next-deprecated](reference/router-navigation-guard-next-deprecated.md) ### Route Lifecycle - Stale data when navigating between same route → See [router-param-change-no-lifecycle](reference/router-param-change-no-lifecycle.md) - Event listeners persisting after component unmounts → See [router-simple-routing-cleanup](reference/router-simple-routing-cleanup.md) ### Setup - Building production single-page application → See [router-use-vue-router-for-production](reference/router-use-vue-router-for-production.md)