Vue Expert
技能 已验证 活跃Builds Vue 3 components with Composition API patterns, configures Nuxt 3 SSR/SSG projects, sets up Pinia stores, scaffolds Quasar/Capacitor mobile apps, implements PWA features, and optimises Vite builds. Use when creating Vue 3 applications with Composition API, writing reusable composables, managing state with Pinia, building hybrid mobile apps with Quasar or Capacitor, configuring service workers, or tuning Vite configuration and TypeScript integration.
To serve as an expert resource for building sophisticated Vue 3 applications with modern patterns and tools.
功能
- Vue 3 Composition API best practices
- Nuxt 3 SSR/SSG configuration
- Pinia state management setup
- Quasar/Capacitor mobile app scaffolding
- PWA implementation and service workers
- Vite build optimization and TypeScript integration
使用场景
- Creating new Vue 3 applications with Composition API.
- Developing reusable composables and managing reactive state.
- Configuring Nuxt 3 projects for SSR or SSG.
- Building hybrid mobile applications with Quasar or Capacitor.
- Implementing PWA features and optimizing Vite builds.
非目标
- Using Vue 2 Options API.
- Mixing Composition API with Options API in components.
- Directly managing DOM elements outside of Vue's reactivity system.
- Replacing core Vite/Nuxt build tooling functionality.
实践
- Composition API patterns
- State management with Pinia
- Nuxt 3 architecture
- Mobile app development patterns
- Build optimization techniques
- TypeScript integration
先决条件
- Vue 3 knowledge
- Node.js environment
- Familiarity with modern JavaScript/TypeScript
安装
请先添加 Marketplace
/plugin marketplace add jeffallan/claude-skills/plugin install claude-skills@fullstack-dev-skills质量评分
已验证类似扩展
Vue Expert Js
97Creates Vue 3 components, builds vanilla JS composables, configures Vite projects, and sets up routing and state management using JavaScript only — no TypeScript. Generates JSDoc-typed code with @typedef, @param, and @returns annotations for full type coverage without a TS compiler. Use when building Vue 3 applications with JavaScript only (no TypeScript), when projects require JSDoc-based type hints, when migrating from Vue 2 Options API to Composition API in JS, or when teams prefer vanilla JavaScript, .mjs modules, or need quick prototypes without TypeScript setup.
Vue Router Best Practices
100Vue Router 4 patterns, navigation guards, route params, and route-component lifecycle interactions.
Create Adaptable Composable
100Create a library-grade Vue composable that accepts maybe-reactive inputs (MaybeRef / MaybeRefOrGetter) so callers can pass a plain value, ref, or getter. Normalize inputs with toValue()/toRef() inside reactive effects (watch/watchEffect) to keep behavior predictable and reactive. Use this skill when user asks for creating adaptable or reusable composables.
Vue Best Practices
99MUST be used for Vue.js tasks. Strongly recommends Composition API with `<script setup>` and TypeScript as the standard approach. Covers Vue 3, SSR, Volar, vue-tsc. Load for any Vue, .vue files, Vue Router, Pinia, or Vite with Vue work. ALWAYS use Composition API unless the project explicitly requires Options API.
前端设计
99通过高设计质量创建独特、生产级的面向接口。当用户要求构建 Web 组件、页面或应用程序时,请使用此技能。生成富有创意、精美的代码,避免通用的 AI 美学。
Auth0 Ionic Vue
99Use when adding Auth0 authentication to an Ionic Vue application with Capacitor — integrates @auth0/auth0-vue SDK with Capacitor Browser and App plugins for native iOS/Android deep linking, login, logout, and user profile display.