我有一个 Angular 11 应用程序,正在使用以下命令构建用于在生产中部署:
npm install
npm run build -- --prod --outputHashing=all
我遇到的问题是,部署后,当我使用浏览器访问应用程序的 URL 时,我仍然看到该应用程序的旧版本。
我最初认为这是一个缓存问题,尽管我正在使用--outputHashing=all
选项(据我所知,它似乎正在工作,输出文件在dist
文件夹的文件名看似随机)。情况似乎是这样:如果我在 Chrome 开发选项中禁用缓存后刷新页面,它现在会显示更新的应用程序。
然而,问题是:如果我关闭浏览器并再次打开它......我会回到旧的应用程序!因此,清除缓存似乎是一种临时解决方案。
经过进一步调查,我怀疑这与角度有关service workers
,因为当我在 Chrome 的开发工具打开的情况下加载页面时,我可以看到很多网络调用被标记为Served from service worker
.
然而,我还不够 Angular 专家,不知道如何进一步诊断。我已经阅读了 Angular 网站上有关 Service Worker 的文档,但它并没有帮助我弄清楚问题到底出在哪里。有人能指出我正确的方向吗?这是我的服务工作线程配置文件,它是在创建应用程序时自动生成的。如果我还需要提供其他文件,请告诉我:
{
"$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)"
]
}
}
]
}
如果有什么区别的话,该应用程序托管在运行嵌入式 Katana Web 服务器的 .NET Core 服务内,但它看不出这会产生什么区别,它只是提供文件而无需进一步操作。