vue-persistent-storage-manager

> Vue plugin that wraps the StorageManager API and provides the state of the persistent-storage permission alongside a storage estimate.

Features

- 🔧 Persistent storage: Request and monitor the persistent-storage permission.
- 💽 Storage estimate: Get storage quota and usage estimates.
- 🔁 Reactive: Provides observable state using Vue's reactivity
- ✔️ SSR: Supports server-side-rendering by validating the availability of the StorageManager API.

Installation

``bash


yarn

$ yarn add vue-persistent-storage-manager

npm

$ npm install vue-persistent-storage-manager
`

Usage

`typescript
import Vue from 'vue'
import { VuePersistentStorageManager } from 'vue-persistent-storage-manager'

Vue.use(VuePersistentStorageManager, { watchStorage: true })
`

Options are not required.
In this case, watchStorage will default to false.

> Note: If watchStorage is set to true, the functions localStorage.setItem and localStorage.removeItem are replaced by functions that update the StorageEstimate.
> The original functions will still be called and are available as localStorage.originalSetItem and localStorage.originalRemoveItem

`vue

`

$3

1. Create the file plugins/persistentStorageManager.ts with the following content.

`typescript
import Vue from 'vue'
import { VuePersistentStorageManager } from 'vue-persistent-storage-manager'

export default () => {
Vue.use(VuePersistentStorageManager, { watchStorage: true })
}
`

2. Update the plugins array in nuxt.config.js.

`typescript
export default {
plugins: [{ src: '~/plugins/persistentStorageManager.ts' }],
}
`

Development

`bash


install dependencies

$ yarn install

build for production

$ yarn build

lint project files

$ yarn lint

run tests

$ yarn test
``

License

MIT - Copyright © Jan Müller