Search code examples
javascriptfunctionvue.jsprogressive-web-appsvuejs3

How to call a function from PWA registerServiceWorker in VUE


I'm using VUE 3 with PWA and I need to call some functions from the registerServiceWorkers.js instead of console logging them, like when an update found or when updated. this is the service worker:

import { register } from 'register-service-worker'

if (process.env.NODE_ENV === 'production') {
  register(`${process.env.BASE_URL}service-worker.js`, {
    ready () {
      console.log(
        'App is being served from cache by a service worker.\n' +
        'For more details,'
      )
    },
    registered () {
      console.log('Service worker has been registered.')

    },
    cached () {
      console.log('Content has been cached for offline use.')
    },
    updatefound () {
      console.log('New content is downloading.')
    },
    updated () {
      console.log('New content is available; please refresh.')
    },
    offline () {
      console.log('No internet connection found. App is running in offline mode.')
    },
    error (error) {
      console.error('Error during service worker registration:', error)
    }
  })
}

any suggestion???


Solution

  • i used this last time: https://dev.to/drbragg/handling-service-worker-updates-in-your-vue-pwa-1pip

    offers you the ability to inform the user for new updates and allows caching them then