删除webpack离线插件的正确方法是什么？

Question

人。我过去曾被分配到一个项目，在该项目中他们有一个webpack脱机插件，但现在我们没有了，因此完全没有必要在项目中使用它。

以这种方式安装：

new OfflinePlugin({
  updateStrategy: 'changed',
  autoUpdate: 1000 * 60 * 10,
  minify: {
    removeComments: true,
    collapseWhitespace: true,
    removeRedundantAttributes: true,
    useShortDoctype: true,
    removeEmptyAttributes: true,
    removeStyleLinkTypeAttributes: true,
    keepClosingSlash: true,
    minifyJS: true,
    minifyCSS: true,
    minifyURLs: true,
  },
  ServiceWorker: {
    events: true,
    navigateFallbackURL: '/',
  },
})

现在，我正在努力删除为生产域上的旧客户端创建的服务工作者，即那些在删除脱机插件之前访问过网站的服务工作者，最重要的是，看起来象facebook scraper工具每次都能获得旧版本我尝试再次抓取，这很关键，因为我已经在生产中部署了新的SSR功能。

我已经尝试过的内容：

1）webpack-remove-serviceworker-plugin

2）将以下代码添加到index.html：

if (window.navigator && navigator.serviceWorker) {
  navigator.serviceWorker.getRegistrations()
    .then(function (registrations) {
      let registrationsLength = registrations.length;
      while(registrationsLength--) {
        registrations[registrationsLength].unregister();
      }
    });
}

3）用以下内容替换sw.js：

self.addEventListener('install', function(e) {
  self.skipWaiting();
});

self.addEventListener('activate', function () {
  self.registration.unregister().then(function () {
    return self.clients.matchAll();
  }).then(function (clients) {
    clients.forEach((client) => {
      if (client.url && 'navigate' in client) {
        client.navigate(client.url);
      }
    });
  });
});

这些都没有为我解决问题。在具有另一个域的新服务器上部署项目可以正常工作。有关此问题的任何提示或建议吗？

Answer 1

我有同样的问题，您需要用旧的sw.js（通过OfflinePlugin生成）替换为包含以下内容的旧sw.js：

self.addEventListener('install', function(e) {
  self.skipWaiting();
});

self.addEventListener('activate', function(e) {
  self.registration.unregister()
    .then(function() {
      return self.clients.matchAll();
    })
    .then(function(clients) {
      clients.forEach(client => client.navigate(client.url))
    });
});

这帮助我删除了一名老服务员。