https://github.com/furudean/svelte-persistent-store

Svelte store that saves and loads data from localStorage or sessionStorage
https://github.com/furudean/svelte-persistent-store

localstorage sessionstorage store svelte svelte-kit

Last synced: 28 days ago
JSON representation

Svelte store that saves and loads data from localStorage or sessionStorage

• Host: GitHub
• URL: https://github.com/furudean/svelte-persistent-store
• Owner: furudean
• License: mit
• Created: 2022-05-21T01:52:04.000Z (over 2 years ago)
• Default Branch: main
• Last Pushed: 2024-04-01T18:46:31.000Z (9 months ago)
• Last Synced: 2024-07-23T01:36:33.407Z (5 months ago)
• Topics: localstorage, sessionstorage, store, svelte, svelte-kit
• Language: JavaScript
• Homepage:
• Size: 102 KB
• Stars: 36
• Watchers: 2
• Forks: 1
• Open Issues: 6
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

• awesome-svelte-stores - @furudean/svelte-persistent-store

README

        


# [svelte-persistent-store](https://www.npmjs.com/package/@furudean/svelte-persistent-store)

This is a

[writable svelte store](https://svelte.dev/docs#run-time-svelte-store-writable)

that saves and loads data from `Window.localStorage` or `Window.sessionStorage`.

Works with Svelte Kit out of the box.

The store listens to events from the `Storage` interface and will sync its

internal state upon changes. This makes debugging using the developer console

easy, and it will update across sessions as well.

## Install

```bash

npm install @furudean/svelte-persistent-store

```

## Use

> **Note**: By default only

> [JSON serializable values](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON/stringify#description)

> are handled, but [custom serialization and deserialization functions can be

> provided](#custom-serialization-functions).

```js

import { persistent } from "@furudean/svelte-persistent-store"

const preferences = persistent({

	start_value: {

		foo: "bar"

	},

	key: "preferences", // key to save as in Storage

	storage_type: "localStorage" // Storage object to use

})

```

## Custom serialization functions

Since the `Storage` interface only supports strings, data needs to be converted

to strings before saving. By default `JSON.stringify` and `JSON.parse` is used.

You can pass custom serializer and deserializer functions if you require

specific behavior when loading or saving data from `Storage`. For example, you

can handle `Date`s like this:

```js

const persistent_date = persistent({

	start_value: new Date(),

	key: "my-persistent-date",

	storage_type: "localStorage",

	serialize: (date) => date.toISOString(), // transform before saving

	deserialize: (str) => new Date(str) // transform after loading

})

```