「pinia」の検索結果

Vue.js 3やNuxtの画面実装を、部品の設計から状態管理、画面遷移、テストまで支えるスキル。具体例に沿ってコードの構成やデータ更新の扱いを見直します。

• Vueコンポーネントの構成レビュー
• 部品間で再利用する処理の切り出し
• Piniaで共有状態を設計したいとき

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).

日本語の概要は準備中です。原文の説明を表示しています。

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.

日本語の概要は準備中です。原文の説明を表示しています。

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.

日本語の概要は準備中です。原文の説明を表示しています。

| 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.

日本語の概要は準備中です。原文の説明を表示しています。

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.

日本語の概要は準備中です。原文の説明を表示しています。

实现 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).

日本語の概要は準備中です。原文の説明を表示しています。

用于设计或审查 Vue 3 + TypeScript 项目结构、SFC/组件边界、composables 组织、路由组合、Pinia 归属、API/错误/样式默认约定、directives 或仓库级 Vue 规范。表单、数据获取、测试、无障碍、虚拟列表、动画或安全深挖优先使用更窄的 skill；中文触发词包括 Vue 3 项目规范、Vue 组件架构。

日本語の概要は準備中です。原文の説明を表示しています。

Use when designing or reviewing Vue 3 + TypeScript project structure, SFC/component boundaries, composables organization, route composition, Pinia ownership, API/error/styling defaults, directives, or repository-wide Vue conventions. Prefer narrower skills for forms, data fetching, tests, accessibility, virtualization, animation, or security deep dives; Chinese triggers include Vue 3 project specification, Vue component architecture.

日本語の概要は準備中です。原文の説明を表示しています。