![](\"https://raw.githubusercontent.com/prazdevs/pinia-plugin-persistedstate/main/docs/public/logo-dark.svg\"){kind=logo}
\n\n \n
\n Configurable persistence and rehydration of Pinia stores.\n
\n\n ![\"npm\"](\"https://img.shields.io/npm/v/pinia-plugin-persistedstate?style=flat-square&labelColor=313244&color=cba6f7\")
![\"minizipped](\"https://img.shields.io/bundlephobia/minzip/pinia-plugin-persistedstate?style=flat-square&labelColor=313244&color=cba6f7\")
![\"license\"](\"https://img.shields.io/github/license/prazdevs/pinia-plugin-persistedstate?style=flat-square&labelColor=313244&color=cba6f7\")
\n Documentation\n
\n\n## Features\n\n- Persist Pinia stores with a friendly API inspired by [`vuex-persistedstate`](https://github.com/robinvdvleuten/vuex-persistedstate).\n- Highly customizable (storage, serializer, paths picking/omitting).\n- Out of the box SSR-friendly support for [`Nuxt`](#usage-with-nuxt).\n- Very smol (<2kB minzipped).\n\n## Quickstart\n\n1. Install with your favorite package manager:\n - **pnpm** : `pnpm add pinia-plugin-persistedstate`\n - npm : `npm i pinia-plugin-persistedstate`\n - yarn : `yarn add pinia-plugin-persistedstate`\n\n2. Add the plugin to pinia:\n\n```ts\nimport { createPinia } from 'pinia'\nimport piniaPluginPersistedstate from 'pinia-plugin-persistedstate'\n\nconst pinia = createPinia()\npinia.use(piniaPluginPersistedstate)\n```\n\n3. Add the `persist` option to the store you want to be persisted:\n\n```ts\nimport { defineStore } from 'pinia'\n\nexport const useStore = defineStore('store', {\n state: () => ({\n someState: 'hello pinia',\n }),\n persist: true,\n})\n```\n\n## Configuration\n\nYou can configure how a store is persisted by specifying options to the `persist` property:\n\n```ts\nexport const useStore = defineStore('store', () => {\n const someState = ref('hello pinia')\n return { someState }\n}, {\n persist: {\n storage: sessionStorage,\n pick: ['someState'],\n },\n})\n```\n\nAll the available configuration options are explained [here](https://prazdevs.github.io/pinia-plugin-persistedstate/guide/config).\n\n## Usage with Nuxt\n\nNuxt support comes out of the box thanks to the included module. You just need to install the package and add the module to your `nuxt.config.ts` as follows:\n\n```ts\nexport default defineNuxtConfig({\n modules: [\n '@pinia/nuxt', // required\n 'pinia-plugin-persistedstate/nuxt',\n ],\n})\n```\n\nMore information on storages and configuration in Nuxt [here](https://prazdevs.github.io/pinia-plugin-persistedstate/frameworks/nuxt).\n\n## Limitations\n\nThere are several limitations that should be considered, more on those [here](https://prazdevs.github.io/pinia-plugin-persistedstate/guide/limitations).\n\n## Contributing\n\nSee the [contribution guide](https://github.com/prazdevs/pinia-plugin-persistedstate/blob/main/CONTRIBUTING.md).\n\n## License\n\n[MIT](https://github.com/prazdevs/pinia-plugin-persistedstate/blob/main/LICENSE) © 2021-present [Sacha Bouillez](https://github.com/prazdevs)\n","_attachments":{},"homepage":"https://prazdevs.github.io/pinia-plugin-persistedstate","bugs":{"url":"https://github.com/prazdevs/pinia-plugin-persistedstate/issues"},"license":"MIT"}