# Vue Patterns > Vue router. Use for component/composable behavior, route-level state, and Vue app feature changes. Use when this capability is needed. - Skill: `tomevault-io/vue-patterns-5` (Agent Skill, multi-file: 2 files) - Install (CLI): `npx skillmds@latest add tomevault-io/vue-patterns-5` - Raw SKILL.md: https://api.skillmd.com/api/skills/tomevault-io/vue-patterns-5/raw - Safety review: pending - Works with: Claude Code, Claude.ai, OpenAI Codex - Category: Web & Frontend - Author: tomevault-io (https://skillmd.com/u/tomevault-io) - Updated: 2026-09-17 - Page: https://skillmd.com/skills/tomevault-io/vue-patterns-5 --- # Vue Patterns ## Use when - task changes Vue components, composables, or route-bound feature behavior - task touches Vue app files using `vue` runtime APIs and project conventions ## Do not use when - task is React/Next-specific component behavior - task is backend-only API/service implementation ## Inspect first - affected `*.vue` components and nearby composables/stores - route definitions and feature module boundaries - tests/specs covering impacted UI behavior ## Avoid mistakes - mutating props directly inside components - leaking global state changes into unrelated feature scopes - mixing composition and options patterns inconsistently in one feature ## Router 1. Load `references/conventions.md` for naming, do/don't, and forbidden patterns. 2. Load `references/scope.md` for component/composable touchpoints. 3. Load `references/workflow.md` only for state-event-render tracing. 4. Keep composables reusable and feature state boundaries explicit. ## References - references/scope.md - references/workflow.md --- > Source: [WeAreHausTech/haus-workflow-catalog](https://github.com/WeAreHausTech/haus-workflow-catalog) — distributed by [TomeVault](https://tomevault.io).