工兵和服务工人

Question

这更像是一个服务人员的问题，尽管它可能更具体地针对Sapper。我真的不知道，因为我是第一个和服务人员打交道的人，我几乎没有使用过他们，而且经常觉得他们是个麻烦。

基本上，无论我做什么，我都无法让localhost:3000停止加载应用程序的旧副本。我以各种方式取消了服务工作人员的注册，包括尝试以编程方式取消注册。我清除了缓存，甚至清除了浏览器中的所有浏览数据。我的Sapper开发环境中的服务器未运行。

这发生在《勇敢》中，但在歌剧中表现相同，似乎是一个普遍的Chromium场景。我不使用火狐或Safari，但可能很快会在其中进行测试，看看那里会发生什么行为。

下面是一个剪辑，展示了我如何尝试注销该服务人员。

https://youtu.be/Cb24I_fEklE

Answer 1

确保关闭运行应用程序的任何浏览器选项卡，在服务人员为现有版本的应用程序提供服务时，您不能更换服务人员。如果存在任何缓存问题，请在安装service worker后尝试重新加载页面。

Answer 2

清除缓存，唯一能让我绕过它的东西。

问题是Service Worker是缓存中的服务，再次从缓存中提供服务可能会将缓存中的此项重置为更有效的发送，并且您会陷入某种循环。

--

我发现这个问题是因为我正在考虑完全删除服务人员，以使我的网站性能更高一点。。。

这是非常必要的吗？它的好处是什么？

Answer 3

我用了这个小技巧，就像一个咒语。在您的rollup.config.js中，在输出对象中有一个serviceWorker对象。

serviceworker: {
    input: config.serviceworker.input(),
    output: config.serviceworker.output(),
    plugins: [
      resolve(),
      replace({
        "process.browser": true,
        "process.env.NODE_ENV": JSON.stringify(mode),
      }),
      commonjs(),
      !dev && terser(),
    ],

    preserveEntrySignatures: false,
    onwarn,
  },

如果尚未声明，请在顶部定义变量dev：

const dev = process.env.NODE_ENV === "development";

现在更改您的service worker配置，如下所示：

serviceworker: !dev && {
    input: config.serviceworker.input(),
    output: config.serviceworker.output(),
    plugins: [
      resolve(),
      replace({
        "process.browser": true,
        "process.env.NODE_ENV": JSON.stringify(mode),
      }),
      commonjs(),
      !dev && terser(),
    ],

    preserveEntrySignatures: false,
    onwarn,
  },