belos-street/vue-router-best-practices
skills/vue-router-best-practices/SKILL.md
Vue Router 4 patterns, navigation guards, route params, and route-component lifecycle interactions.
$ install --global
skillsauthnpx skillsauth add belos-street/skill-kit vue-router-best-practicesInstall this skill globally with one command. Works with Claude Code, Cursor, and Windsurf.
Security Scan Results
3 of 9 scanners reported clean
Some scanners were skipped, did not run, or reported a non-clean status. Review each row below.
3
Scanners Passed
9
Scanners in report
Clean
TrivyContainer and dependency vulnerability scanner
95%
Clean
SemgrepStatic code analysis for vulnerabilities
95%
Clean
mcp-scan (Snyk)Model Context Protocol security validation
95%
Skipped
Snyk (dep)Open source security scanning
50%
Skipped
Socket.devSupply chain security analysis
50%
Skipped
VirusTotalMulti-engine malware detection
50%
Skipped
CrowdStrikeAdvanced threat intelligence
50%
Skipped
OSV-ScannerOpen Source Vulnerability database check
50%
Skipped
OWASP Dep-Check
50%
Last scanned: May 14, 2026, 2:16 AM154.7s10 files scanned
SKILL.md
- 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
- Accessing component instance in beforeRouteEnter guard → See router-beforerouteenter-no-this
- Navigation guard making API calls without awaiting → See router-guard-async-await-pattern
- Users trapped in infinite redirect loops → See router-navigation-guard-infinite-loop
- Navigation guard using deprecated next() function → See router-navigation-guard-next-deprecated
Route Lifecycle
- Stale data when navigating between same route → See router-param-change-no-lifecycle
- Event listeners persisting after component unmounts → See router-simple-routing-cleanup
Setup
- Building production single-page application → See router-use-vue-router-for-production
Related Skills
belos-street/zustand
development
VerifiedTrustedCommunity
Modern, lightweight state management for React
6SKILL.mdUpdated May 14, 2026
belos-street/writing-plans
development
VerifiedTrustedCommunity
Use when you have a spec or requirements for a multi-step task, before touching code
6SKILL.mdUpdated May 14, 2026
belos-street/vue
development
VerifiedTrustedCommunity
Vue 3 Composition API, script setup macros, reactivity system, and built-in components. Use when writing Vue SFCs, defineProps/defineEmits/defineModel, watchers, or using Transition/Teleport/Suspense/KeepAlive.
6SKILL.mdUpdated May 14, 2026
belos-street/vercel-react-native-skills
development
VerifiedTrustedCommunity
React Native and Expo best practices for building performant mobile apps. Use when building React Native components, optimizing list performance, implementing animations, or working with native modules. Triggers on tasks involving React Native, Expo, mobile performance, or native platform APIs.
6SKILL.mdUpdated May 14, 2026