Package Exports

@vue/cli-plugin-pwa
@vue/cli-plugin-pwa/lib/HtmlPwaPlugin

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@vue/cli-plugin-pwa) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

@vue/cli-plugin-pwa

pwa plugin for vue-cli

Configuration

Configuration is handled via the pwa property of either the vue.config.js file, or the "vue" field in package.json.

pwa.workboxPluginMode

This allows you to the choose between the two modes supported by the underlying workbox-webpack-plugin.
- 'GenerateSW' (default), will lead to a new service worker file being created each time you rebuild your web app.
- 'InjectManifest' allows you to start with an existing service worker file, and creates a copy of that file with a "precache manifest" injected into it.
The "Which Plugin to Use?" guide can help you choose between the two modes.
pwa.workboxOptions

These options are passed on through to the underlying workbox-webpack-plugin.

For more information on what values are supported, please see the guide for GenerateSW or for InjectManifest.

Example Configuration

// Inside vue.config.js
module.exports = {
  // ...other vue-cli plugin options...
  pwa: {
    workboxPluginMode: 'InjectManifest',
    workboxOptions: {
      // swSrc is required in InjectManifest mode.
      swSrc: 'dev/sw.js',
      // ...other Workbox options...
    },
  },
};

Installing in an Already Created Project

npm install -D @vue/cli-plugin-pwa
vue invoke pwa

Injected webpack-chain Rules

config.plugin('workbox')