Vue 3/VitePWA - autoUpdate - not reloading page #438
Comments
|
@crunchwrap89 what's your full pwa configuration file? |
|
|
I'm having exactly the same issue here. I have to manually refresh the page with hard reload. And on my phone it's a bit more annoying as emptying the cache is not as easy. |
|
so, the sw keeps on yellow state (skip waiting), I'll check it, I have tested it only on desktop... |
|
upps, ok, we should merge pending PR #428 |
|
@userquin i updated to 14.1 and unfortunately it still doesn't reload the page automatically after new version is downloaded. |
|
@crunchwrap89 check #377 |
Ah yes, adding below code to the main.ts file solved the issue. It now reloads the page automatically after update was downloaded. import { registerSW } from 'virtual:pwa-register'
registerSW({ immediate: true })Can this solution be added to the documentation on https://vite-pwa-org.netlify.app/guide/auto-update.html ? |
|
Pr welcome, send it to docs repo |
|
i will fork and create PR tomorrow |
|
Awesome, now its more clear. :) Sorry i didnt make the pr myself, I am sick and dont have energy to do it yet. There is also another warning or hint that could be added to docs: public assets such as robots.txt, sitemap.xml and even manifest.webmanifest should be added to includeAssets in the vitePWA plugin options. Otherwise service worker will serve 404 page route instead. |
|
@crunchwrap89 PR welcome: robots.txt and sitemap.xml not necessary to be included, both only used by crawlers. There is no problem adding them to the sw precache manifest. |
|
Hi @userquin , While the old version files are deleted and the new version's files are processed, if you refresh the page and switch between pages, it throws the following error because it cannot find the old javascript files. At the same time, the automatic reload doesn't work because it throws this error. TypeError: Failed to fetch dynamically imported module: Error screenshot
Error videovideo.mp4Demo link: https://vue-router-3.d2y8hqcamgs1js.amplifyapp.com/ vite.config.ts main.ts Package versionsServer : Amplify |
|
I have same problem. Page not reload. |
|
I've met the same problem, but after I tried, I found that's because I did: export default VitePWA({
registerType: 'autoUpdate',
injectRegister: 'inline',
})However, because I also used The solution is set |
|
@userquin Please add this notice to the doc, so people won't be dumb |
I got the same issue. Your solution worked. |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
"vue": "^3.2.45",
"vite": "^4.0.1",
"vite-plugin-pwa": "^0.14.0",
with below settings in vite.config.ts, my service worker is currently automatically downloading the new version in the background, but it is not automatically reloading the page to show the new version.
....
Currently i must manually reload the page for the new version to take effect.
I have tried it in multiple types of browsers and devices. Same issue on all.
What might be the reason to the page not being automatically reloaded?
I checked the documentation and according to them it should automatically reload when registerType is on autoUpdate?
I tried adding clientsClaim: true, and skipWaiting: true, but still the same issue.
The text was updated successfully, but these errors were encountered: