问题
I have a PWA in Angular 8. I have added $ ng add @angular/pwa
, and the PWA functionality seems to work, accept for this problem: when I push a new build to production, the app is not updated on people's browsers (tested on Chrome and mobile Safari).
Instead, when a user opens their browser to go to the app, he/she will see the previous (non-updated) version of the app that was previously on their browser.
They will only see the newer version if they refresh the page. No errors are shown.
I push to production using $ ng build --prod
, and then insert the build into AWS Amplify.
The app should always update to the newest build when a user opens it in a browser. That is not happening.
I have seen discussion of this on Stack Overflow from the last few years, such as here and here. But these questions don't have accepted answers, and the advice given are about implementing workarounds.
What is the solution to this issue?
In my case, the app is being iterated a lot, and it pulls a lot of local assets. So a user still seeing a build from a week ago is a significant issue. I am hoping this is not the expected behavior--bc that is a big drawback to PWA functionality if it is.
In the Angular docs there is some discussion of "updateMode", but it looks to me like my settings are already in place to work properly, but the issue remains. Here is my ngsw-config.json:
{
"$schema": "./node_modules/@angular/service-worker/config/schema.json",
"index": "/index.html",
"assetGroups": [
{
"name": "app",
"installMode": "prefetch",
"resources": {
"files": [
"/favicon.ico",
"/index.html",
"/manifest.webmanifest",
"/*.css",
"/*.js"
]
}
}, {
"name": "assets",
"installMode": "lazy",
"updateMode": "prefetch",
"resources": {
"files": [
"/assets/**",
"/*.(eot|svg|cur|jpg|png|webp|gif|otf|ttf|woff|woff2|ani)"
]
}
}
]
}
来源:https://stackoverflow.com/questions/60867977/angular-pwa-doesnt-update-in-production