Getting started

Supported Tauri Version

This plugin requires Tauri 2.0 or later.

Install

Install the Rust crate by adding the following to your Cargo.toml file:

[dependencies]
tauri-plugin-pinia = 0.9

Install the JavaScript package with your preferred package manager:

npm

npm install tauri-plugin-pinia

pnpm

pnpm add tauri-plugin-pinia

yarn

yarn add tauri-plugin-pinia

bun

bun add tauri-plugin-pinia

Usage

1. Enable the required permissions in your capabilities file:

src-tauri/capabilities/pinia.json

{
  "identifier": "pinia",
  "windows": ["*"],
  "permissions": ["pinia:default", "core:event:default"]
}

2. Register the plugin with Tauri:

src-tauri/src/main.rs

tauri::Builder::default()
  .plugin(tauri_plugin_pinia::init())
  .run(tauri::generate_context!())
  .expect("error while running tauri application");

3. Enable the plugin for Pinia:

src/index.ts

import { createApp } from 'vue';
import { createPinia } from 'pinia';
import { createPlugin } from 'tauri-plugin-pinia';

const app = createApp(App);

const pinia = createPinia();
pinia.use(createPlugin());

app.use(pinia)
app.mount('#app');

TIP

createPlugin is also exported as TauriPluginPinia.

4. Define your Pinia store:

src/stores/counter.ts

import { ref } from 'vue';
import { defineStore } from 'pinia';

export const useCounterStore = defineStore('counter', () => {
  const counter = ref(0);
  return { counter };
});

5. Start the plugin:

src/App.vue

import { useCounterStore } from './stores/counter';

const counterStore = useCounterStore();
await counterStore.$tauri.start();

TIP

The stores won't be saved nor synchronized until you call the start method.

Nuxt

If you are using Nuxt, you can create a Nuxt plugin to enable it for Pinia:

plugins/pinia.ts

import type { Pinia } from 'pinia';
import { TauriPluginPinia } from 'tauri-plugin-pinia';

// See: https://pinia.vuejs.org/core-concepts/plugins.html#Nuxt-js
export default defineNuxtPlugin(({ $pinia }) => {
  ($pinia as Pinia).use(TauriPluginPinia());
});