@wranggle/storage-web

WranggleStorage bundle that includes the main feature layers and persistence adapters for a Browser environment

Usage no npm install needed!

<script type="module">
  import wranggleStorageWeb from 'https://cdn.skypack.dev/@wranggle/storage-web';
</script>

README

@wranggle/storage-web

This @wranggle/storage-web package bundles the main feature layers and persistence adapters used in web pages and browser extensions. (~20k total size.)

This page is dedicated to installation/setup. See the main WranggleStorage documentation for additional instructions.

Setup

Installation

Using a bundler (Webpack/Browserify/Rollup)

  1. Add the package @wranggle/storage-web to your project:

    # From the command line using yarn:
    yarn add @wranggle/storage-web
    
    # or with npm:
    npm install @wranggle/storage-web 
    
  2. In your JavaScript, import or require WranggleStorage:

    import { WranggleStorage } from '@wranggle/storage-web'; 
    // or:
    const { WranggleStorage } = require('@wranggle/storage-web');  
    

Directly in HTML

Load the library in your page

<script src="https://cdn.jsdelivr.net/npm/@wranggle/storage-web@latest"></script>

Create your store

Make sure your persistence library is available. For a web page, this is typically LocalForage— see their installation instructions.

In a web page, the following sets up your store (without any feauture layers yet added):

const store = new WranggleStorage({ localForage })

LocalForage not included

If you want to configure LocalForage (eg, to specify its storage driver) see the LocalForage adapter instructions.

In a browser extension, you would use a different persistence adapter. Eg:

const store = new WranggleStorage({ chrome: true })

Next Steps

Next, you'll want to add some feature layers. See the main WranggleStorage documentation for instructions.