mirror of https://github.com/vuejs/vue-cli.git synced 2026-02-09 16:38:28 -06:00

Files

Jinesh Shah 36f954bfc9 feat(pwa): Make injected meta tags configurable and change defaults (#961 )

This change proposes 2 things:

1. Make apple-mobile-web-app-capable and apple-mobile-web-app-status-bar-style configurable
2. Change the defaults to "no" and "default", respectively

2018-04-25 15:25:20 -04:00

__tests__

Fix typos (#865 )

2018-02-22 11:37:22 +09:00

generator

fix: fix pwa + ts + lint (close #937 )

2018-03-03 17:32:56 -05:00

lib

feat(pwa): Make injected meta tags configurable and change defaults (#961 )

2018-04-25 15:25:20 -04:00

.npmignore

add npmignore

2018-01-05 09:20:20 -05:00

index.js

fix(pwa): set cacheid in GenerateSW mode only (#939 )

2018-03-03 21:19:34 -05:00

package.json

v3.0.0-beta.7

2018-04-25 10:58:49 -04:00

README.md

docs(pwa): Document themeColor and msTileColor (#954 )

2018-04-25 14:38:10 -04:00

README.md

@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: {
    name: 'My App', // used for apple-mobile-web-app-title
    themeColor: '#4DBA87',
    msTileColor: '#000000',
    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')