vue-pinia-best-practices

What problem does it solve?

Pinia best practices help Vue 3 projects avoid common state management pitfalls such as exposing wrong state from setup stores, destructuring state which breaks reactivity, and misusing store references in templates.

Core Features & Use Cases

• Guidance on returning all state from setup stores to preserve SSR, DevTools visibility, and plugin compatibility.
• Reframing store usage with storeToRefs to maintain reactivity when destructuring.
• Patterns for correct template bindings, lazy store access, and consistent naming conventions.

Quick Start

Audit your Pinia stores and update setup stores to expose all state, getters, and actions; use storeToRefs for reactive state; avoid top-level store usage to keep patterns consistent across the codebase.