Vue Patterns
Vue 3 Composition API patterns: component architecture, reactivity, Pinia state management, Vue Router, and Nuxt SSR.
- What
- Vue 3 Composition API patterns: component architecture, reactivity, Pinia state management, Vue Router, and Nuxt SSR.
- Cost
- Free
- Needs
- Use "Vue Patterns" with your Muse.
- Install
- Copy the installer prompt below into your Muse — your agent does the rest.
Curated by Skill Harbor: a patterns skill for building and reviewing Vue 3 apps with the Composition API the way experienced Vue developers do. It covers component architecture (feature-first project layout, base vs feature components), reactivity done right (refs vs reactive, computed, watchers without footguns), Pinia stores for state management, Vue Router navigation patterns, and Nuxt SSR where it differs from vanilla Vue. Testing with Vitest and performance guidance round it out. Everything is written for `<script setup>` and modern Vue, with good/bad pairs that show the reactive pitfall next to the clean version. By @affaan-m, listed here with credit to its creator. From the affaan-m/ECC repository (MIT). Honest caveats: pure guidance, nothing to install; targets Vue 3 Composition API, Options API users will need to translate; Nuxt sections assume a Nuxt project. Skill Harbor never reviews the code, review it yourself before use.
Version:
Install
Copy the install package below, then paste it into MuseThe install prompt below already includes the vetting steps: your agent follows the community checklist before installing anything with executable code. Want more?
Use "Vue Patterns" with your Muse. Prerequisites: a Vue 3 (or Nuxt/Pinia) codebase to write or review. Pure guidance skill, nothing to install. 1. Open the skill: https://github.com/affaan-m/ECC/blob/main/skills/vue-patterns/SKILL.md and copy the full SKILL.md text. 2. Paste it into a chat with Muse and add: "Review this Vue component against these patterns: Composition API usage, reactivity, Pinia store shape." 3. For new features, ask: "Build this the Vue 3 way: <script setup>, a composable for the logic, and a Pinia store if state is shared." Tip: paste one component or composable at a time; whole-app reviews come back shallow. Safety: a skill is plain-text instructions; it runs nothing by itself. Never paste secrets into a chat, and review anything Muse proposes before it changes your code.
Saved to your recent installs. Find it anytime on /connect.
Questions
How do I install a build?
Every product page includes a copy-paste install prompt. Paste it into your Muse and it sets the build up for you — no manual configuration.
Where does my money go?
Straight to the seller. Skill Harbor never processes payments: checkout happens on the seller’s own page, usually Stripe.
What does the ✓ next to a creator’s name mean?
It means we confirmed the identity of the person behind the listing. It says nothing about the code itself — always check a build before installing it.