# Improve Pinia Store Reliability

Pinia apps often fail from early store access, broken reactivity, or hidden setup-store state. This skill gives Claude, Codex, and Claude Code practical checks for safer Vue state management.

## Install

```bash
npx skillstore add github.com/vuejs-ai/vuejs-ai-vue-pinia-best-practices
```

## Metadata

- Status: approved
- Slug: vuejs-ai-vue-pinia-best-practices
- Version: 1.0.0
- Author version: 1.0.0
- Skillstore revision: r1
- Version status: valid
- Tree hash: a37494c90c7168c75507aa1e77df32c1a7ac25e3a52078462c0ce4fd1f060d8c
- Author: github.com/vuejs-ai
- GitHub username: vuejs-ai
- License: MIT
- Repository: https://github.com/vuejs-ai/skills/tree/main/skills/vue-pinia-best-practices/
- Ref: 36e07d5e13068e5be64447e8f20b427cf2cbd21a
- Supported tools: Claude, Codex, Claude Code
- Audit status: complete
- Agent install advisory: allowed
- Manual install advisory: allowed
- Artifact signature: available
- Audit attestation: unavailable
- Human verification: not\_verified
- Risk factors: scripts, external\_commands, network
- Quality score: 80
- Quality tier: silver
- Public page: https://skillstore.pages.dev/skills/vuejs-ai-vue-pinia-best-practices
- Manifest: https://skillstore.pages.dev/api/skills/vuejs-ai-vue-pinia-best-practices/manifest

## Capabilities

- Explains how to avoid the no active Pinia startup error.
- Shows when to return all state from Pinia setup stores.
- Compares storeToRefs destructuring with direct store access.
- Guides URL state patterns for shareable filters.
- Covers template method binding gotchas and parentheses.

## Use Cases

- Fix Store Initialization Errors: Diagnose startup crashes caused by calling Pinia stores before the app installs Pinia.
- Review Setup Store Design: Check whether setup stores return required state for DevTools, SSR, plugins, and persistence.
- Plan Shareable Filter State: Choose when filters belong in the URL, a Pinia store, or a hybrid pattern.

## Prompt Templates

### Fix a Startup Error

```
Review my Vue app startup flow for the no active Pinia error. Identify store calls that run too early and suggest the correct order.
```

### Review Store Reactivity

```
Check this component for Pinia destructuring problems. Explain which values should use storeToRefs and which actions should stay on the store.
```

### Plan URL Filter State

```
Help me design filter state for a product list. Decide which values should live in the URL and which should stay in Pinia.
```

### Audit a Large Pinia App

```
Audit this Pinia architecture for setup-store return issues, SSR risks, plugin order problems, and method binding mistakes. Prioritize production risks.
```

## Limitations

- It provides guidance only and does not run project tests.
- It focuses on Vue 3 and Pinia, not Vuex migration details.
- It cannot verify SSR behavior without project-specific context.
- It does not replace official Pinia documentation for API coverage.

## Best Practices

- Install Pinia before plugins that access stores.
- Return all reactive state, computed getters, and actions from setup stores.
- Use storeToRefs for reactive state destructuring and keep actions on the store.

## Anti Patterns

- Calling useStore at module scope before app initialization.
- Hiding setup-store state by omitting it from the return value.
- Passing store methods as bare template references when context matters.

## Security Audit

- Audited at: 2026-07-07T07:00:31.685\+00:00
- Summary: AI review found the static findings are documentation examples, not executable skill behavior. Dynamic imports, fetch calls, Authorization headers, and Object.keys appear inside Pinia guidance snippets using local app paths; no prompt injection, credential exfiltration, or command execution intent was found.

## Stats

- Views: 178
- Downloads: 24
- Favorites: 0
- Popularity score: 0
