如何在create-react-app中以开发人员模式启用Service Worker？

Question

我知道我们可以在生产模式下测试服务人员，但是重新构建和部署的过程非常烦人。 有什么方法可以在开发人员模式下启用Serive Worker？

Answer 1

改变这个

window.addEventListener('load', () => {

      const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;


      console.log("file location" + swUrl);
      if (isLocalhost) {
        // This is running on localhost. Let's check if a service worker still exists or not.
        checkValidServiceWorker(swUrl, config);

        // Add some additional logging to localhost, pointing developers to the
        // service worker/PWA documentation.
        navigator.serviceWorker.ready.then(() => {
          console.log(
            'This web app is being served cache-first by a service ' +
              'worker. To learn more, visit'
          );
        });
      } else {
        // Is not localhost. Just register service worker
        registerValidSW(swUrl, config);
      }
    });

有了这个

window.addEventListener('load', () => {

      const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;

      console.log("file location" + swUrl);

        // Is not localhost. Just register service worker
        registerValidSW(swUrl, config);

    });

在您的serviceWorker.js文件中

也把替换这个

if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator ) {

有了这个

if ( 'serviceWorker' in navigator ) {

注意其检查产品，因此删除该条件将在本地也启动服务人员