Skip to content

rishabh3112/gridsome-plugin-pwa

Repository files navigation

gridsome logo

gridsome-plugin-pwa

A PWA plugin for gridsome

npm version npm npm bundle size

Installation

# For npm
$ npm install gridsome-plugin-pwa
# For yarn
$ yarn add gridsome-plugin-pwa

Usage

Add gridsome-plugin-pwa to plugin array with following configurable options to gridsome.config.js

Defaults for required fields and example for optional fields values are mentioned below along side properties

...
plugins:[
    {
        use: 'gridsome-plugin-pwa',
        options: {
            // Service Worker Options
            disableServiceWorker: false,
            serviceWorkerPath: 'service-worker.js',
            cachedFileTypes: 'js,json,css,html,png,jpg,jpeg,svg,gif',
            disableTemplatedUrls: false,       // Optional

            // Manifest Options (https://developer.mozilla.org/en-US/docs/Web/Manifest)
            manifestPath: 'manifest.json',
            id: "Gridsome",
            title: 'Gridsome',
            startUrl: '/',
            display: 'standalone',
            statusBarStyle: 'default',
            themeColor: '#666600',
            backgroundColor: '#ffffff',

            // icon should be a path to the static folder i.e. 'static/icon.png'
            icon: '',

            // set {maskableIcon: true} to use the same icon (this will set
            // {purpose:  'maskable any'}), or specify a different icon path
            maskableIcon: true,                 // Optional
            shortName: 'Gridsome',              // Optional
            description: 'Gridsome is awesome!',// Optional
            categories: ['education'],          // Optional
            lang: 'en-GB',                      // Optional
            dir: 'auto',                        // Optional
            screenshots: [                      // Optional
                {
                    src: 'src/screenshot1.png',
                    sizes: '1280x720',
                    type: 'image/png',
                },
            ],
            shortcuts: [                        // Optional
                {
                    name: "View Subscriptions",
                    short_name: "Subscriptions",
                    description: "View the list of podcasts you listen to",
                    url: "/subscriptions?utm_source=homescreen",
                    icons: [{ src: "/icons/subscriptions.png", sizes: "192x192" }]
                }
            ],
            gcmSenderId: undefined,             // Optional

            // Standard Meta Tags
            svgFavicon: 'favicon.svg',          // Optional. Requires favicon.ico fallback

            // Microsoft Windows Meta Tags
            msTileColor: '#666600',             // Optional

            // Apple MacOS Meta Tags
            appleMaskIcon: 'favicon.svg',       // Optional
            appleMaskIconColor: '#666600',      // Optional
        }
    }
]

License (MIT)

Open LICENSE file for more info