31건 · 관련도순
Build or review Vue.js 3 and Nuxt interfaces using practical patterns for components, shared state, navigation, and tests. Learn how to organize code and manage reactivity, the mechanism that updates the interface when data changes.
한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.
Build Vue 3 components and reusable logic, manage shared application data with Pinia, and configure Nuxt 3 projects. Supports mobile apps, offline web features, TypeScript checks, component tests, and Vite build optimization.
한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.
Build Vue 3 interfaces from JSON specifications, including AI-generated layouts. The skill covers component registration, named content areas, synchronized form values, conditional visibility, validation, actions, and connections to external state management.
한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.
Use when writing, reviewing, or refactoring Vue 3 code — components, composables, reactivity, Pinia state, Pinia Colada data-fetching, file-based routing, and forms. Targets Composition API + <script setup> + TypeScript. Auto-activates on .vue files. For deep best-practices review/recommendations or the full ordered workflow (built-in components, animations, performance pass), use mk:vue-best-practices.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Testing Vue 3 SPAs: Vitest + @vue/test-utils, RTL-style alternatives, Pinia testing via createTestingPinia, composable testing, msw for network mocks, Cypress component testing, Playwright e2e. Use this skill to: - Set up Vitest for Vue 3 with jsdom + @vue/test-utils. - Pick mount vs shallowMount. - Test components by props/emits/slots contract. - Mock Pinia stores in tests. - Test composables in isolation. - Set up Playwright or Cypress for end-to-end. Do NOT use this skill for: - General Vue conventions (see vue-conventions). - State patterns (see vue-state-management). - Form-specific patterns (see vue-forms).
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Build Vue 3 applications using JavaScript and JSDoc comments that describe data types. Create components and reusable logic, configure Vite, routing, and state management, and check annotations and behavior with ESLint and Vitest.
한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.
Pinia official Vue state management library, type-safe and extensible. Use when defining stores, working with state/getters/actions, or implementing store patterns in Vue apps.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Pinia stores, state management patterns, store setup, and reactivity with stores.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Pinia v3 Vue state management with defineStore, getters, actions. Use for Vue 3 stores, Nuxt SSR, Vuex migration, or encountering store composition, hydration, testing errors.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
| Nuxt 4 data management: composables, data fetching with useFetch/useAsyncData, and state management with useState and Pinia. Use when: creating custom composables, fetching data with useFetch or useAsyncData, managing global state with useState, integrating Pinia, debugging reactive data issues, or implementing SSR-safe state patterns.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Pinia Colada data fetching for Vue/Nuxt with useQuery, useMutation. Use for async state, query cache, SSR, or encountering invalidation, hydration, TanStack Vue Query migration errors.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
实现 API 调用 / 缓存 / 加载 / 错误处理 / 乐观更新时使用。覆盖 TanStack Query / SWR / RTK Query / Apollo Client / urql / Pinia Colada / Pinia Query。融合 stale-while-revalidate + 乐观更新 + Mutation + 无限加载。
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
State management decision tree for Vue 3 SPAs: ref/reactive locally, composables for shared logic, Pinia for app-wide state, provide/inject for DI, TanStack Query Vue for server state. Vuex pointer for Vue 2 legacy. Use this skill to: - Pick the right state tool for the data shape (local / shared / server / form). - Implement a Pinia store (Setup syntax preferred). - Use provide/inject correctly with InjectionKey<T>. - Set up TanStack Query Vue for server state. - Migrate from Vuex (with caution; only if BA asks). Do NOT use this skill for: - General SFC conventions (see vue-conventions). - Form state (see vue-forms — vee-validate handles that). - Routing state (see vue-routing — use vue-router useRoute). - Testing stores (see vue-testing).
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Pinia stores, Vue 3 state patterns. Use when managing client state in Vue applications, choosing between Options/Setup stores, composing stores, or implementing persistence.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Vue 3 authoring/review: components, composables, reactivity, Pinia, Pinia Colada, file routing, forms. Composition API + script setup. Auto-activates on .vue files. Deep review: mk:vue-best-practices.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Use for Vue 3 testing best-practices review and recommendations — designing and auditing Vitest + Vue Test Utils tests for components, composables, Pinia stores, Vue Router, async/Suspense, Teleport, forms, and accessibility, plus Playwright E2E test-design strategy. Advisory/review only — recommends patterns and flags test smells; does not run tests. Complements mk:vue-best-practices (feature code). Invoke for "review my Vue tests", "how should I test this component/composable/store", or "Vue test best practices".
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
MUST 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.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Builds Vue 3 components with Composition API, configures Nuxt 3 SSR/SSG, sets up Pinia stores, scaffolds Quasar/Capacitor mobile apps, and implements PWA features.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
PowerX Nuxt Pinia Store 规范。
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Nuxt 5 data management with useFetch, useAsyncData, useState, and Pinia. Use when creating composables, fetching data, managing state, or debugging reactive/SSR data issues.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Expert guide for Vue 3 (Composition API), Nuxt 3, and Pinia. Covers advanced reactive state management, `<script setup>` syntax, Vue Router, VueUse, and SPA/SSR architectural patterns in English and Indonesian.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
选择和实现状态管理方案时使用。覆盖 React (Redux Toolkit / Zustand / Jotai / Valtio / TanStack Query) / Vue (Pinia) / Angular (NgRx / Signals) / Svelte (Stores / Runes)。融合客户端状态 + 服务端状态分离。
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Vue 3 form patterns: native v-model, vee-validate + zod (most common), VueUse helpers, defineModel for custom inputs, controlled vs uncontrolled, field arrays, multi-step wizards. Use this skill to: - Wire vee-validate with a validation schema (zod / yup). - Build custom form components with defineModel (Vue 3.4+). - Implement multi-step forms. - Handle async validation. - Integrate forms with TanStack Query mutations or Pinia actions. Do NOT use this skill for: - General SFC conventions (see vue-conventions). - State management (see vue-state-management). - Routing (see vue-routing). - Testing forms (see vue-testing).
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
State management for Angular 18-21: signals (signal/computed/effect), services-as-state, NgRx Store + Effects + Selectors, NgRx Component Store, NgRx Signals (newer signal-based store). RxJS essentials — operators, async pipe, takeUntilDestroyed, signal/observable interop. Use this skill to: - Pick the right state tool (signals / services / NgRx variant / vue-query equivalent). - Use signals correctly (signal/computed/effect — when each). - Build a Pinia-style service-as-state singleton. - Set up NgRx Store + Effects + Selectors. - Use RxJS without leaking subscriptions (async pipe, takeUntilDestroyed, Subject patterns). - Bridge signals ↔ observables via toSignal / toObservable. Do NOT use this skill for: - General Angular conventions (see angular-conventions). - Routing state (see angular-routing). - Form state (see angular-forms). - Testing state (see angular-testing).
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.