
pinia-plugin-persistedstate
Go to documentationConfigurable persistence and rehydration of Pinia stores.
Artwork from Pinia
pinia-plugin-persistedstate
Configurable persistence and rehydration of Pinia stores.
✨ Features
- Persist Pinia stores with a friendly API inspired by
vuex-persistedstate
. - Highly customisable with custom storage, customer serializer, paths picking...
- Compatible with everything that uses Pinia.
- No external dependencies in a tiny package (<1kB gzipped).
🚀 Quickstart
- Install with your favorite package manager:
- pnpm :
pnpm i pinia-plugin-persistedstate
- npm :
npm i pinia-plugin-persistedstate
- yarn :
yarn add pinia-plugin-persistedstate
- pnpm :
- Add the plugin to pinia:
import { createPinia } from 'pinia'import piniaPluginPersistedstate from 'pinia-plugin-persistedstate'const pinia = createPinia()pinia.use(piniaPluginPersistedstate)
- Add the
persist
option to the store you want to be persisted:
import { defineStore } from 'pinia'export const useStore = defineStore('store', { state: () => { return { someState: 'hello pinia', } }, persist: true,})
🔧 Configuration
You can configure how a store is persisted by specifying options to the persist
property:
import { defineStore } from 'pinia'export const useStore = defineStore('store', { state: () => { return { someState: 'hello pinia', } }, persist: { storage: sessionStorage, paths: ['someState'], },})
All the available configuration options are explained here.
⚠️ Limitations
There are some limitations that should be considered, more on those here.
🤝 Contributing
Run into a problem? Open an issue. Want to add some feature? PRs are welcome!
👤 About the author
Feel free to contact me:
📝 License
Copyright © 2021-present Sacha Bouillez.
This project is under MIT license.