workbox is not defined

[nevaan9]

Library Affected:
workbox-webpack-plugin

Browser & Platform:
all browsers

Issue or Feature Request Description:
I am using workbox-webpack-plugin to setup my service worker. I added the InjectManifest pointing to my service-worker file, however, when I load the webpage I get an error saying "workbox is not defined". This is because the service worker file has no reference to the workbox object. The docs claim that the workbox object will get auto injected during build, but this does not seem like the case (or am I totally wrong?); However, when I use a CDN in my service-worker file, it works. Could someone please point me what I am doing wrong here?

[philipwalton]

Before using the workbox object, you need to import the workbox-sw loader package, which you can read how to do here: https://developers.google.com/web/tools/workbox/guides/get-started#importing_workbox

In short, you need to add something like the following to the top of your service worker file:

importScripts('https://storage.googleapis.com/workbox-cdn/releases/5.0.0/workbox-sw.js');

// ...

[ngstwr]

@philipwalton and when we are using workbox-webpack then too ?

[manjunathgk22]

Facing the same issue. any solution?

[nevaan9]

@manjunathgk22 are you using webpack? If so just install the required packages and import it in your service-worker file.
https://developers.google.com/web/tools/workbox/guides/using-bundlers