Workbox in Polymer 3 SPA, getting "process is not defined"

Polymer 3 SPA trying to migrate from sw-precahe to Workbox. I use the workbox-window module to integrate the lifecycle into the application to enable users to be informed of new versions.

I use the 5.0.0-beta version to be able to use the update()-functionality, however this issue is valid on v4.3.1 as well. After creating the service worker and running my SPA I get "process is not defined" in logger.js.

I have tried including different versions of the workbox build files and if I include the umd versions it works, but my SPA builds for ES6 modules so I´d like to use those imports.

"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',
    }
  ]

My goal is to understand why this is failing as I realize that I´m probably doing something wrong in my configuration. So, any suggestions appreciated!

Solution

You should be able to use either the workbox-window.prod.mjs or workbox-window.dev.mjs bundles for that purpose. They're shipped as ES modules with process.env.NODE_ENV removed, as well as a few other optimizations.

You can either reference them from the CDN URL, or serve them locally—they're under node_modules/workbox-window/build/ if you've installed workbox-window from npm.

Here's an example:

<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>