[Vuejs]-Vue-cli + workbox not caching content

1👍

Your RegExp is not correct. The leading and trailing / should not be there since you are also wrapping the pattern in a string.

You can test the RegExp like this:

new RegExp('/.*(?:googleapis)\.com\/.*$/').exec('https://www.googleapis.com/tasks/v1/users/@me/lists')
=> null

Try removing the leading and trailing /:

new RegExp('.*(?:googleapis)\.com\/.*$').exec('https://www.googleapis.com/tasks/v1/users/@me/lists')
=> ["https://www.googleapis.com/tasks/v1/users/@me/lists", index: 0, input: "https://www.googleapis.com/tasks/v1/users/@me/lists", groups: undefined]

1👍

Do you use workbox-webpack-plugin?

const workboxPlugin = require('workbox-webpack-plugin')

// vue.config.js
module.exports = {
  configureWebpack: {
    plugins: [
      new workboxPlugin({
        ...
        runtimeCaching: [ {
           urlPattern: new RegExp('/.*(?:googleapis)\.com.*$/'),
           handler: 'staleWhileRevalidate',
        }]
      })
    ]
  }
}
👤ittus

Leave a comment