How to automatically update from deployed vue-cli/pwa

[zenute]

Hello,
I´ve tried the solution proposed in issue #223 by @userquin in 2022, but it did not work.
We have about 30k users in our base, and it would be a big problem to ask them to update manually
Is there a different way to do it now?

[userquin]

You can use a custom self destroying sw then add your new sw using vite-plugin-pwa, to do so:

• get the name of your current sw name
• create an empty file in your public folder (vite project) with previous name: service-worker.js iirc
• go to https://vite-pwa-org.netlify.app/guide/unregister-service-worker.html#custom-selfdestroying-service-worker and copy the code
• paste the code in the empty service worker file created in the public folder
• add the pwa options in your new vite application
• ensure filename option is <> file name created in the public folder

You should test it in your local:

• open old vue cli app and install in your local the sw (just visit the page)
• stop the vue cli server app
• start your new vite app in the same port
• refresh the page: the old service worker should be removed, the page reloaded (and old sw precaching storage removed) and the new service worker installed

EDIT: you should use build + preview in both cli app and vite app

WARNING: DON'T REMOVE THE SW FROM THE public FOLDER (it should be always deployed in your vite app)

[zenute]

The solution did work in local server.
Soon, we will deploy it to a production server.
I hope it goes well as in local server.

Thank you, @userquin .