ngcc modifies node_module making it no longer work in a web worker

Bug Report

Affected Package

This issue is caused by ngcc (as far as I can tell)

Is this a regression?

Yes, this previously used to work. I’m not sure exactly what version broke it but, I had this working in angular 10 (or a very early version of angular 11).

Description

It appears ngcc is modifying files within node_modules/@datorama/akita/lib. The modificaitons add @angular/core as an import in store.d.ts (among a few other lines of code). Once this occurs I am no longer able to build the app if a web worker imports the @datorama/akita package as @angular/core requires the dom library which is not available in a web worker.

Minimal Reproduction

I have a reproduction here: https://stackblitz.com/edit/angular-ivy-wvs54l However, stackblitz doesn’t seem to support webworkers. So, you need to download the project and then perform:

npm i
npm run ng build

Essentially all you need to do is create an angular app

• Add the @datorama/akita npm package
• Add a webworker
• Instantiate the webworker in the angular app
• In the webworker import the @datorama/akita package

Once you have done this any attempt to build the app will fail.

Exception or Error

Error: ./src/app/web-workers/test.worker.ts (./node_modules/worker-plugin/dist/loader.js?name=0!./src/app/web-workers/test.worker.ts)
Module build failed (from ./node_modules/worker-plugin/dist/loader.js):
Error: node_modules/@angular/core/core.d.ts:10411:62 - error TS2304: Cannot find name 'Element'.

10411 export declare function ɵgetDebugNode__POST_R3__(nativeNode: Element): DebugElement__POST_R3__;

There are more errors that follow which all are basically due to the dom library not being available in a web worker.

Your Environment

Angular Version:

Angular CLI: 11.2.13
Node: 14.16.0
OS: win32 x64

Angular: 11.2.13
... animations, cli, common, compiler, core, forms
... platform-browser, platform-browser-dynamic, router
Ivy Workspace: Yes

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1102.13
@angular-devkit/build-angular   0.1102.13
@angular-devkit/core            7.3.10
@angular-devkit/schematics      7.3.10
@angular/compiler-cli           11.2.14
@schematics/angular             11.2.13
@schematics/update              0.1102.13
rxjs                            6.6.7
typescript                      4.0.7

Anything else relevant?

So, I don’t really know how ngcc works but, what I do know is that I end up with 2 files in @datorama/akita/lib

• store.d.ts
• store.d.ts.__ivy_ngcc_bak

If I replace store.ts with store.d.ts.__ivy_ngcc_bak I can now build successfully.

[petebacondarwin]

The longer term problem is that, while it is ngcc that is adding the typing dependency, there is still an implicit dependency between Aikita and Angular because the Store is marked as an Angular directive. So even moving on to the new partial compiled Ivy library distribution will not solve the problem.

[angular-automatic-lock-bot[bot]]

This issue has been automatically locked due to inactivity. Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}