lukeed

@pwa/plugin-sw-precache

PWA plugin for SW Precache

#Install

$ npm install --save-dev @pwa/plugin-sw-precache

#Usage

The plugin is recognized by and attached to @pwa/core automatically.

However, you must manually include the generated sw.js file into your bundle!

if (process.env.NODE_ENV === 'production') {
  if ('serviceWorker' in navigator) {
    navigator.serviceWorker.register('/sw.js');
  }
}

Note: For SW beginners, it's strongly recommended you use the above snippet!
However, it's not required to wrap registration in a NODE_ENV === 'production' check.

#Config

Configurable via the precache key on your pwa.config.js file.

Default Config:

exports.precache = {
  minify: true,
  filename: 'sw.js',
  // stripPrefix: env.src
  navigateFallback: 'index.html',
  navigateFallbackWhitelist: [/^(?!\/__).*/],
  staticFileGlobsIgnorePatterns: [
    /\.git/,
    /\.DS_Store/,
    /^manifest.*\.js(?:on)?$/,
    /\.gz(ip)?$/,
    /\.map$/,
    /\.br$/
  ]
}

Available Options:

See Options for sw-precache-webpack-plugin.

See also

@pwa/cli(3), @pwa/core(3), @pwa/plugin-brotli(3), @pwa/plugin-buble(3), @pwa/plugin-critters(3), @pwa/plugin-eslint(3), @pwa/plugin-gzip(3), @pwa/plugin-imagemin(3), @pwa/plugin-offline(3), @pwa/plugin-prettier(3)