vite-pwa/vite-plugin-pwa

service-worker cannot detect new version to update cache when using Link, NavLink in React

thiencao-a6 opened this issue · 8 comments

thiencao-a6 commented

i am using vite-plugin-pwa for my react app, it works well until i replace "a" tag to Link, NavLink(react-router-dom). My app cannot detect changing every i deploy new version. Hence, my app still display old contents if i don't reload page

userquin commented

Use vanillajs or react virtual module, check the example in the examples folder: check the warning in the docs https://vite-pwa-org.netlify.app/guide/auto-update.html

I Will try to add a new internal recipe to reload all clients from the service worker (no idea if we can do that using generateSW strategy).

  • ❤️1
thiencao-a6 commented

Use vanillajs or react virtual module, check the example in the examples folder: check the warning in the docs https://vite-pwa-org.netlify.app/guide/auto-update.html

i have followed to this example, it is using "a" tag, i replaced to (Link, NavLink) and it didn't work anymore. I think because service-worker hasn't supported for "client side routing"

userquin commented

What's your vite pwa configuration?

thiencao-a6 commented

What's your vite pwa configuration?

I mean i use example react-router in examples folder, just change "a" tag to Link in this file
vite-router-about

kristjanm commented

Hey, did you manage to get this solved with react-router-dom Link? I'm at the same place as you - it's working with a href, but not with the Link.

thiencao-a6 commented

Hey, did you manage to get this solved with react-router-dom Link? I'm at the same place as you - it's working with a href, but not with the Link.

I'm not sure, but it seems that the reason is because the Link tag does not refresh the page like a tag"

kristjanm commented

Hey, did you manage to get this solved with react-router-dom Link? I'm at the same place as you - it's working with a href, but not with the Link.

I'm not sure, but it seems that the reason is because the Link tag does not refresh the page like a tag"

If it helps you, I solved it with configuring the service worker to do regular checks for updates.

  • ❤️1
thiencao-a6 commented

Hey, did you manage to get this solved with react-router-dom Link? I'm at the same place as you - it's working with a href, but not with the Link.

I'm not sure, but it seems that the reason is because the Link tag does not refresh the page like a tag"

If it helps you, I solved it with configuring the service worker to do regular checks for updates.

thank you, i will try