Skip to content

Nuxt

Add the module in nuxt.config.ts to auto-import all composables and register the plugin with a prefix from runtimeConfig.

ts
// nuxt.config.ts
export default defineNuxtConfig({
  modules: ['vue-storage-kit/nuxt'],

  storageKit: {
    prefix: 'myapp_',
    autoImports: true, // default: true
  },
})

The storageKit block is fully typed — a wrong-shaped option is caught by TypeScript in your editor, not just at runtime.

Options

prefix

string

Forwarded to VueStoragePlugin's own prefix option.

autoImports

boolean · default: true

Auto-import useStorage, useLocalStorage, useSessionStorage, useIndexedDB, useIDBRef, and useCookie globally.

With autoImports: true the following are available globally without an explicit import. useCookie here resolves to the SSR-aware runtime version (H3-backed on the server), not the client-only one exported from the package root:

ts
useStorage()
useLocalStorage()
useSessionStorage()
useIndexedDB()
useIDBRef()
useCookie()

SSR caveat: the StorageEngine instance cache (keyed by target:key, shared across both the Vue and React bindings) is a module-level singleton per server process, not per-request. target: 'local' / 'session' already fail closed to defaultValue server-side (there's no window in Node). target: 'memory'/'indexeddb', however, have no such guard and would share state across concurrent requests on the same server if used during SSR — avoid those targets for per-request/per-user data server-side; they're intended for client-side use.