配置基本工作箱

Question

您好我想在workbox上尝试一些基本配置。  webpack文件部分：

new workboxPlugin({
    globDirectory: DIST_DIR,
    globPatterns: ['**/*.{html,js,css}'],
    swDest: path.join(DIST_DIR, 'sw.js'),
}),

给了我sw.js

    importScripts('workbox-sw.prod.v2.0.1.js');    
    const fileManifest = [
          {
            "url": "bundle.js",
            "revision": "84672073db22fef0c8901d059044b7f2"
          },
          {
            "url": "js/index.js",
            "revision": "74ca2d3205fd59dffc0e7245643f7872"
          },
          {
            "url": "main.css",
            "revision": "ecce481ad315950d06e887ad1327bdf3"
          },
  {
    "url": "../index.html",
    "revision": "ecce481ad315950d06e887ad1327bdf3"
  }
        ];

        const workboxSW = new self.WorkboxSW();
        workboxSW.precache(fileManifest);

在缓存上我看到信息：

当我在离线模式下寻找页面时，我看不到任何东西。这是否意味着服务人员不工作？或者我的配置不好？

提前致谢。

Answer 1

当您的当前配置将所有捆绑包添加到缓存存储时。 当你去网络应用程序＆＃34; /＆＃34;我猜sw与确切的网址不匹配。

我想需要添加一个密钥：navigateFallback: index.html（如果你的是SPA）。

现在，当您导航到您的网络应用时，导航失败将为您打开index.html。