Skip to content

Pinia

A lightweight, type-safe state store for Vue apps, built on the Composition API.

Stars
14.8k
Forks
1.2k
Licence
MIT
Language
TypeScript
Last update
10 days ago
Type
Library

What it is

Pinia is a state management library for Vue. It gives an app a central place to keep shared data, such as a logged-in user or a shopping cart, so components can read and change it without passing values through many layers. Stores are defined in separate files and can be used from any component, and the project notes DevTools support for inspecting them.

  • Keep a logged-in user's details in one store and read them in any component
  • Store a shopping cart or settings object and update it from actions
  • Split application state into several stores, each defined in its own file
  • Use getters to compute derived values such as a doubled counter from stored state

Great for

  • Vue 3 developers who need shared state across several components
  • Teams using TypeScript who want store types inferred automatically
  • Projects using the Composition API or Nuxt (a @pinia/nuxt module is listed)
  • Developers migrating from Vuex, which the FAQ describes Pinia as succeeding

Not ideal for

  • Projects on Vue 2: the README says the main version targets Vue 3 and points to a separate v2 branch
  • Apps with only a few components and no shared state, where a plain reactive object may be enough
  • Non-Vue front-end frameworks, since the library is built specifically for Vue
Step-by-step guide: how to use PiniaInstall, first run, examples, tips and FAQs

How to get it

  1. 1

    Install with a package manager

    You'll need: Node.js (version not specified in README) · A Vue 3 project

    Install pinia and the DevTools API package

    npm install pinia @vue/devtools-api
  2. 2

    Run it

    • Install the packages with npm, pnpm, or yarn.
    • Create a pinia instance with createPinia() in your entry file.
    • Pass it to the app with app.use(pinia), then mount the app.
    • Define a store with defineStore in a file such as src/stores/main.ts.
    • Call the store hook (for example useMainStore()) inside a component's setup.
  3. 3

    Get the most out of it

    • Use storeToRefs to pull out reactive state and getters while keeping reactivity
    • Define getters that call other getters with this, as shown in the README example
    • Create several focused stores in separate files rather than one large store
    • Follow the Nuxt configuration guide in the docs if you use Nuxt, since the README links to it
    • Try the StackBlitz demos for Vue 3 and Nuxt 3 to see working examples

Downloads

Strengths

  • Stores are defined with a small API (state, getters, actions) that the README shows in a short example
  • Type-safe by design, according to the README
  • Supports DevTools and is described as light in size

Trade-offs

  • The README is short and offers little detail on advanced topics, so the full documentation site is needed for depth
  • The README does not describe exact bundle sizes or benchmarks, so the 'extremely light' claim is unverified here
  • Dynamic modules are not supported in the type-safe way; the FAQ suggests creating multiple stores instead

How it compares

ProjectStarsTypeLevelUpdatedBest for
pinia (this)14.8kLibrarybeginner10 days agoVue 3 developers who need shared state across several components
vuex28.3kLibraryintermediate2.1 years agoTeams maintaining an existing Vue app that already uses Vuex
zustand58.9kLibrarybeginner15 days agoReact developers who want simpler shared state than Redux
redux-toolkit11.2kLibraryintermediate4 days agoDevelopers already using or learning Redux for app state
jotai21.3kLibrarybeginner14 days agoReact developers who want simple shared state without heavy setup
vue-admin-template20.4kLibraryintermediate2.5 years agoDevelopers starting a new internal admin panel or back-office tool in Vue

Stats synced from GitHub. The assessment above was drafted with AI from the project's README on 2026-10-29 and may miss recent changes — check the README before relying on a command. MIT licence: free to use, modify and distribute, including commercially, as long as you keep the copyright notice.