Agent skill
pinia
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.
Install this agent skill to your Project
npx add-skill https://github.com/aiskillstore/marketplace/tree/main/skills/antfu/pinia
Metadata
Additional technical details for this skill
- author
- Anthony Fu
- source
- Generated from https://github.com/vuejs/pinia, scripts located at https://github.com/antfu/skills
- version
- 2026.1.28
SKILL.md
Pinia
Pinia is the official state management library for Vue, designed to be intuitive and type-safe. It supports both Options API and Composition API styles, with first-class TypeScript support and devtools integration.
The skill is based on Pinia v3.0.4, generated at 2026-01-28.
Core References
| Topic | Description | Reference |
|---|---|---|
| Stores | Defining stores, state, getters, actions, storeToRefs, subscriptions | core-stores |
Features
Extensibility
| Topic | Description | Reference |
|---|---|---|
| Plugins | Extend stores with custom properties, state, and behavior | features-plugins |
Composability
| Topic | Description | Reference |
|---|---|---|
| Composables | Using Vue composables within stores (VueUse, etc.) | features-composables |
| Composing Stores | Store-to-store communication, avoiding circular dependencies | features-composing-stores |
Best Practices
| Topic | Description | Reference |
|---|---|---|
| Testing | Unit testing with @pinia/testing, mocking, stubbing | best-practices-testing |
| Outside Components | Using stores in navigation guards, plugins, middlewares | best-practices-outside-component |
Advanced
| Topic | Description | Reference |
|---|---|---|
| SSR | Server-side rendering, state hydration | advanced-ssr |
| Nuxt | Nuxt integration, auto-imports, SSR best practices | advanced-nuxt |
| HMR | Hot module replacement for development | advanced-hmr |
Key Recommendations
- Prefer Setup Stores for complex logic, composables, and watchers
- Use
storeToRefs()when destructuring state/getters to preserve reactivity - Actions can be destructured directly - they're bound to the store
- Call stores inside functions not at module scope, especially for SSR
- Add HMR support to each store for better development experience
- Use
@pinia/testingfor component tests with mocked stores
Recommended Agent Skills
Expand your agent's capabilities with these related and highly-rated skills.
perigon-backend
Perigon ASP.NET Core + EF Core + Aspire conventions
perigon-agent
Pointers for Copilot/agents to apply Perigon conventions
perigon-angular
Angular 21+ standalone/Material/signal conventions for Perigon WebApp
fastapi-mastery
Comprehensive FastAPI development skill covering REST API creation, routing, request/response handling, validation, authentication, database integration, middleware, and deployment. Use when working with FastAPI projects, building APIs, implementing CRUD operations, setting up authentication/authorization, integrating databases (SQL/NoSQL), adding middleware, handling WebSockets, or deploying FastAPI applications. Triggered by requests involving .py files with FastAPI code, API endpoint creation, Pydantic models, or FastAPI-specific features.
context7-efficient
Token-efficient library documentation fetcher using Context7 MCP with 86.8% token savings through intelligent shell pipeline filtering. Fetches code examples, API references, and best practices for JavaScript, Python, Go, Rust, and other libraries. Use when users ask about library documentation, need code examples, want API usage patterns, are learning a new framework, need syntax reference, or troubleshooting with library-specific information. Triggers include questions like "Show me React hooks", "How do I use Prisma", "What's the Next.js routing syntax", or any request for library/framework documentation.
browser-use
Browser automation using Playwright MCP. Navigate websites, fill forms, click elements, take screenshots, and extract data. Use when tasks require web browsing, form submission, web scraping, UI testing, or any browser interaction.
Didn't find tool you were looking for?