使用配置了runtimeCaching的sw-precache不会加载sw-toolbox

Question

根据sw-precache文档，https://github.com/GoogleChrome/sw-precache#runtime-caching包括sw-precache的运行时缓存配置，应该自己负责，包括动态内容的运行时缓存的sw-toolbox。我已经尝试在sw-precache的CLI和grunt-sw-precache中使用它。我对Grunt的配置如下：

grunt.initConfig({
'sw-precache': {
  build: {
    baseDir: './public',
    workerFileName: 'service-worker.js',
    appendTimestamp: true,
    cacheId: 'cnbc-polymer-cache-20',
    clientsClaim: true,
    directoryIndex: 'index.html',
    navigateFallback: 'index.html',
    skipWaiting: true,
    maximumFileSizeToCacheInBytes: (1024000 * 20),
    staticFileGlobs: [
      '/src/**/*',
      '/index.html',
      '/manifest.json',
      '/bower_components/**/*',
      '/images/**/*.*',
      '/favicon.ico'
    ],
    verbose: true,
    runtimeCaching: [{
        urlPattern: /franchise/,
        handler: 'cacheFirst',
        options: {
          debug: true,
          cache: {
            maxEntries: 10,
            name: 'franchise-cache',
            maxAgeSeconds: 180
          }
        }
      }, {
        urlPattern: /story/,
        handler: 'cacheFirst',
        options: {
          debug: true,
          cache: {
            maxEntries: 10,
            name: 'story-cache',
            maxAgeSeconds: 180
          }
        }
      }]
  }
}

})；

在尝试使用CLI时，我使用了以下sw-precache config.js：

module.exports = {
    baseDir: './public',
    workerFileName: 'service-worker.js',
    appendTimestamp: true,
    cacheId: 'cnbc-polymer-cache-20',
    clientsClaim: true,
    directoryIndex: 'index.html',
    navigateFallback: 'index.html',
    skipWaiting: true,
    maximumFileSizeToCacheInBytes: (1024000 * 20),
    staticFileGlobs: [
        '/src/**/*',
        '/index.html',
        '/manifest.json',
        '/bower_components/**/*',
        '/images/**/*.*',
        '/favicon.ico'
    ],
    verbose: true,
    runtimeCaching: [{
        urlPattern: /franchise/,
        handler: 'cacheFirst',
        options: {
            debug: true,
            cache: {
                maxEntries: 10,
                name: 'franchise-cache',
                maxAgeSeconds: 180
          }
        }
      }, {
          urlPattern: /story/,
          handler: 'cacheFirst',
          options: {
              debug: true,
              cache: {
                  maxEntries: 10,
                  name: 'story-cache',
                  maxAgeSeconds: 180
              }
          }
      }]
};

除服务选项之外的所有配置选项都将应用于生成的runtimeCaching -worker.js文件。

我的package.json被配置为使用sw-precache的"^4.2.3“和sw-toolbox的"^3.4.0”。

我还没有看到其他人对这个问题发表评论。有没有人能评论一下是什么问题阻止了sw-precache尊重我的runtimeCaching选项？

Answer 1

遗憾的是，grunt-sw-precache不依赖于最新的sw-precache，这导致缺少runtimeCaching选项和其他改进，sw-precache如何正确处理requestsRedirects之类的事情。

我克隆了存储库和必要的更改here。我不打算把这个发布到npm上，只是作为一个临时的解决方案(所以在你的package.json中参考我的github repo！)