Question

在本地环境中，由http-server提供服务时，我的Ng7应用程序可以完美运行。但是，当使用Netlify在线部署时，使用以下ngsw-config.json

不会缓存文件

{
  "index": "/index.html",
  "assetGroups": [
    {
      "name": "app",
      "installMode": "prefetch",
      "resources": {
        "files": [
          "/favicon.ico",
          "/index.html",
          "/*.css",
          "/*.js"
        ]
      }
    }, {
      "name": "assets",
      "installMode": "lazy",
      "updateMode": "prefetch",
      "resources": {
        "files": [
          "/assets/**",
          "/*.(eot|svg|cur|jpg|png|webp|gif|otf|ttf|woff|woff2|ani)"
        ]
      }
    }
  ]
}

我发现js文件中有一些个缓存，但它们的内容长度均为0，这意味着它们实际上甚至没有任何内容。有趣的是，它拒绝缓存实际上是最大的main.HASH.js文件。

更新

我已从此question开始工作，并从文件中删除了index.html，我可以得到.js文件列表以显示在高速缓存存储中。

但是，像以前一样，它们的内容长度均为零！

Answer 1

首先，您必须将资产的installMode设置为“ prefetch”-这样可以确保在您的应用启动时，给定的资源将被ServiceWorker缓存。您将其设置为惰性-这意味着仅在请求资源时才将其缓存。参见angular guide 有时（根据我的经验）updateMode会导致问题-因此请在没有资产“ updateMode”的情况下进行尝试。因此ngsw-config.json看起来像这样：

{
  "index": "/index.html",
  "assetGroups": [
    {
      "name": "app",
      "installMode": "prefetch",
      "resources": {
        "files": [
          "/favicon.ico",
          "/index.html",
          "/*.css",
          "/*.js"
        ]
      }
    }, {
      "name": "assets",
      "installMode": "prefetch",
      "resources": {
        "files": [
          "/assets/**",
          "/*.(eot|svg|cur|jpg|png|webp|gif|otf|ttf|woff|woff2|ani)"
        ]
      }
    }
  ]
}

Angular 7 Service Worker未在生产中缓存资产

1 个答案: