Workbox в Polymer 3 SPA, получение "процесс не определен"

Question

Polymer 3 SPA пытается перейти с sw-precahe на Workbox. Я использую модуль рабочего окна-окна для интеграции жизненного цикла в приложение, чтобы пользователи могли получать информацию о новых версиях.

Я использую бета-версию 5.0.0, чтобы иметь возможность использовать функцию update(), однако эта проблема актуальна и для версии 4.3.1. После создания сервис-воркера и запуска моего SPA я получаю сообщение "процесс не определен" в logger.js.

Я пробовал включать разные версии файлов сборки рабочего стола, и если я включаю версии umd, это работает, но мои сборки SPA для модулей ES6, поэтому я хотел бы использовать этот импорт.

"globDirectory": "./",
  "globPatterns": [
    "**/*.{js,css,json,svg,png,jpg,gif,html}",
    "manifest.json"
  ],
  "swDest": "service-worker.js",
  "globIgnores": ["node_modules/**/*", "build/**/*", "workbox-config.js"],
  "inlineWorkboxRuntime": "true",
  "maximumFileSizeToCacheInBytes": 10*1024*1024,
  "runtimeCaching":
  [
    {
      urlPattern: /\/node_modules\/@webcomponents\/webcomponentsjs\//,
      handler: 'StaleWhileRevalidate'
    },
    {
      urlPattern: /\/node_modules\/web-animations-js\//,
      handler: 'StaleWhileRevalidate',
    }
  ]

Моя цель - понять, почему это не удается, поскольку я понимаю, что, вероятно, что-то делаю неправильно в своей конфигурации. Итак, любые предложения приветствуются!

Answer 1

Вы должны иметь возможность использовать либо workbox-window.prod.mjs или workbox-window.dev.mjsсвязки для этой цели. Они поставляются как модули ES сprocess.env.NODE_ENV удален, а также несколько других оптимизаций.

Вы можете ссылаться на них по URL-адресу CDN или обслуживать их локально - они находятся под node_modules/workbox-window/build/ если вы установили workbox-window от npm.

Вот пример:

<script type="module">
import {Workbox} from
  'https://storage.googleapis.com/workbox-cdn/releases/5.0.0-beta.1/workbox-window.prod.mjs';

if ('serviceWorker' in navigator) {
  const wb = new Workbox('/service-worker.js');

  // Use wb...
}
</script>