error TS2304: Cannot find name 'ExtendableEvent'.

Hello everyone, it is my first use of WorkBox, so it’s probably an obvious problem…

Library Affected: workbox-background-sync workbox-routing workbox-strategies

Browser & Platform: all browsers

Issue or Feature Request Description: I’m getting those errors when trying to build :

node_modules/workbox-core/types.d.ts:8:13 - error TS2304: Cannot find name 'ExtendableEvent'.

8     event?: ExtendableEvent;
              ~~~~~~~~~~~~~~~

node_modules/workbox-core/types.d.ts:30:13 - error TS2304: Cannot find name 'ExtendableEvent'.

30     event?: ExtendableEvent;
               ~~~~~~~~~~~~~~~

node_modules/workbox-core/types.d.ts:81:13 - error TS2304: Cannot find name 'ExtendableEvent'.

81     event?: ExtendableEvent;
               ~~~~~~~~~~~~~~~

node_modules/workbox-core/types.d.ts:91:13 - error TS2304: Cannot find name 'ExtendableEvent'.

91     event?: ExtendableEvent;
               ~~~~~~~~~~~~~~~

node_modules/workbox-core/types.d.ts:100:13 - error TS2304: Cannot find name 'ExtendableEvent'.

100     event?: ExtendableEvent;
                ~~~~~~~~~~~~~~~

node_modules/workbox-routing/Router.d.ts:79:17 - error TS2304: Cannot find name 'ExtendableEvent'.

79         event?: ExtendableEvent;
                   ~~~~~~~~~~~~~~~

node_modules/workbox-routing/Router.d.ts:97:17 - error TS2304: Cannot find name 'ExtendableEvent'.

97         event?: ExtendableEvent;
                   ~~~~~~~~~~~~~~~

node_modules/workbox-strategies/CacheFirst.d.ts:60:47 - error TS2304: Cannot find name 'ExtendableEvent'.

60     _getFromNetwork(request: Request, event?: ExtendableEvent): Promise<any>;
                                                 ~~~~~~~~~~~~~~~

node_modules/workbox-strategies/NetworkFirst.d.ts:85:17 - error TS2304: Cannot find name 'ExtendableEvent'.

85         event?: ExtendableEvent;
                   ~~~~~~~~~~~~~~~

node_modules/workbox-strategies/StaleWhileRevalidate.d.ts:68:17 - error TS2304: Cannot find name 'ExtendableEvent'.

68         event?: ExtendableEvent;
                   ~~~~~~~~~~~~~~~


Found 10 errors.

Here is my tsconfig :

{
    "compilerOptions": {
        "outDir": "build/dist",
        "module": "esnext",
        "target": "es5",
        "lib": [
          "es2017",
          "dom",
          "dom.iterable",
          "webworker"
        ],
        "sourceMap": true,
        "baseUrl": "./src",
        "jsx": "react",
        "allowSyntheticDefaultImports": true,
        "moduleResolution": "node",
        "forceConsistentCasingInFileNames": true,
        "noImplicitReturns": true,
        "suppressImplicitAnyIndexErrors": true,
        "noUnusedLocals": true,
        "allowJs": true,
        "experimentalDecorators": true,
        "skipLibCheck": true
    },
    "include": [
        "./src",
        "./utils",
        "./mock"
    ],
    "exclude": [
        "node_modules",
        "build"
    ]
}

And I add in my project those 4 libs from workbox :
“workbox-background-sync”: “^5.1.3”, “workbox-core”: “^5.1.3”, “workbox-routing”: “^5.1.3”, “workbox-strategies”: “^5.1.3”

Thanks you

[Haprog]

I just ran into this same issue in a project where I get:

ERROR in [at-loader] ./node_modules/workbox-core/types.d.ts:8:13 
    TS2304: Cannot find name 'ExtendableEvent'.

ERROR in [at-loader] ./node_modules/workbox-core/types.d.ts:30:13 
    TS2304: Cannot find name 'ExtendableEvent'.

ERROR in [at-loader] ./node_modules/workbox-core/types.d.ts:81:13 
    TS2304: Cannot find name 'ExtendableEvent'.

ERROR in [at-loader] ./node_modules/workbox-core/types.d.ts:91:13 
    TS2304: Cannot find name 'ExtendableEvent'.

ERROR in [at-loader] ./node_modules/workbox-core/types.d.ts:100:13 
    TS2304: Cannot find name 'ExtendableEvent'.

ERROR in [at-loader] ./node_modules/workbox-core/_private/fetchWrapper.d.ts:5:13 
    TS2304: Cannot find name 'ExtendableEvent'.

ERROR in [at-loader] ./node_modules/workbox-core/_private/resultingClientExists.d.ts:12:84 
    TS2304: Cannot find name 'Client'.

ERROR in [at-loader] ./node_modules/workbox-precaching/PrecacheController.d.ts:42:17 
    TS2304: Cannot find name 'ExtendableEvent'.

ERROR in [at-loader] ./node_modules/workbox-precaching/PrecacheController.d.ts:81:17 
    TS2304: Cannot find name 'ExtendableEvent'.

But the weird thing is this happens only randomly (maybe 20-50% of the time) when I run webpack multiple times in a row.

This is with webpack 4.42.0, typescript 3.8.3 and workbox 5.1.4.

But thanks for the hint about “lib”. In this project we were not specifying “lib” atm. so I’m now trying with:

    "lib": [
      "es2017",
      "dom",
      "dom.iterable",
      "webworker"
    ],

So far it seems like this is the solution for me (but I’ll need to see if this problem still occurs randomly), but I can’t really understand why it would randomly succeed and randomly fail without having the webworker lib declared, I would expect it to fail consistently if that lib is required when any dependency uses types defined in https://github.com/microsoft/TypeScript/blob/master/lib/lib.webworker.d.ts. I guess it might be a typescript issue.

[jeffposnick]

Here’s an example of a CodeSandbox project that shows this working: https://codesandbox.io/s/divine-pine-hh0ww?file=/src/sw.ts

The IDE’s TypeScript integration shows that the code compiles without error. Maybe comparing that setup with your project’s config will give some clues?

The main thing I had to do was add “webworker” to the list of libraries, as mentioned above.

I did not need to add

declare let self: ServiceWorkerGlobalScope;

but for some scenarios (where self might otherwise be inferred to be something else) I’ve seen that help.