Seeking a basic PWA Configuration for caching static files and automatic cache updates

[DidoMarchet]

Hi,
I'm looking for a sample of a basic PWA configuration. I’ve tried many configurations found on the web, but they were either too basic or overly complex.

My goal is to cache static files like images, scripts, and fonts. I want to avoid 404 errors and app crashes caused by cache issues, so I’d like to enable automatic cache updates to avoid manual maintenance. (I opened an issue too vite-pwa/nuxt#174)

Could anyone share a good and complete tutorial, comprehensive documentation (the plugin docs are a bit too basic as well), or a simple configuration example to get me started? Any advice would be appreciated!

Thanks and kind regards,
Davide

[userquin]

are you using SSG (nuxt generate) in your app?

[userquin]

upps, your SW not being registered, missing web manifest (404), enable this flag in your pwa options: registerWebManifestInRouteRules: true (this will configure your web manifest properly in Netlify)

Maybe you will need to change something in some resource.

[userquin]

You also need to add cache-control: public,max-age=0,must-revalidate to all your static pages, I'll check the options to enable this in Netlify.

You should also use nuxt netlify preset in your build.

[userquin]

can you go to discord here https://discord.gg/DsGQCgPQ and send me a direct message in vite-plugin-pwa channel?

[DidoMarchet]

Hi thanks! I remove the pea from the app because they had cache issue so it's not registered. 😞

[DidoMarchet]

can you go to discord here https://discord.gg/DsGQCgPQ and send me a direct message in vite-plugin-pwa channel?

Sure! Thanks !

[DidoMarchet]

Thanks @userquin you solve my issue with patience :D https://vite-pwa-org.netlify.app/guide/unregister-service-worker.html#custom-selfdestroying-service-worker