feat(workbox): workbox 3 + offlinePage

packages/workbox/index.js

@@ -98,10 +98,11 @@ function addTemplates (options) {
         handler: i.handler || 'networkFirst',
         method: i.method || 'GET'
       }))),
+      clientClaims: options.clientClaims,
       wbOptions: {
         cacheId: options.cacheId,
-        clientsClaim: options.clientsClaim,
-        directoryIndex: options.directoryIndex
+        directoryIndex: options.directoryIndex,
+        cleanUrls: false
       }
     }
   })
@@ -131,13 +132,13 @@ function emitAssets (options) {
     const source = readFileSync(path)
     const hash = hashSum(source)
     const dst = `${name}.${hash}.${ext}`
-    assets.push({source, dst})
+    assets.push({ source, dst })
     return dst
   }
 
   // Write assets after build
   const hook = builder => {
-    assets.forEach(({source, dst}) => {
+    assets.forEach(({ source, dst }) => {
       writeFileSync(path.resolve(this.options.buildDir, 'dist', dst), source, 'utf-8')
     })
   }
@@ -165,6 +166,11 @@ function emitAssets (options) {
 function workboxInject (options) {
   const hook = () => {
     const opts = Object.assign({}, options)
+    const VALID_KEYS = [
+      'swDest', 'swSrc', 'globDirectory', 'globFollow', 'globIgnores', 'globPatterns', 'dontCacheBustUrlsMatching',
+      'globStrict', 'templatedUrls', 'maximumFileSizeToCacheInBytes', 'modifyUrlPrefix', 'manifestTransforms'
+    ]
+    Object.keys(opts).filter(k => !VALID_KEYS.includes(k)).forEach(k => { delete opts[k] })
     delete opts.runtimeCaching
     return swBuild.injectManifest(opts)
   }

packages/workbox/package.json

@@ -8,6 +8,6 @@
     "access": "public"
   },
   "dependencies": {
-    "workbox-build": "^2.1.2"
+    "workbox-build": "^3.0.1"
   }
 }

packages/workbox/templates/sw.template.js

@@ -1,11 +1,14 @@
 importScripts(<%= options.importScripts.map(i => `'${i}'`).join(', ') %>)
 
-const workboxSW = new self.WorkboxSW(<%= JSON.stringify(options.wbOptions, null, 2) %>)
+workbox.precaching.precacheAndRoute([], <%= JSON.stringify(options.wbOptions, null, 2) %>)
 
-workboxSW.precache([])
+
+<% if(options.clientClaims) { %>
+  workbox.clientClaims()
+<% } %>
 
 <% options.runtimeCaching.forEach(r => {
   const strategy = JSON.stringify(r.strategyOptions || {})
   %>
-workboxSW.router.registerRoute(new RegExp('<%= r.urlPattern %>'), workboxSW.strategies.<%= r.handler %>(<%= strategy %>), '<%= r.method %>')
+workbox.routing.registerRoute(new RegExp('<%= r.urlPattern %>'), workboxSW.strategies.<%= r.handler %>(<%= strategy %>), '<%= r.method %>')
 <% }) %>