Tried to overwrite @angular/cdk/stepper/step-header.d.ts.__ivy_ngcc_bak with an ngcc back up file, which is disallowed

Question

After upgrading @angular/core and @angular/material using ng update command, the ngcc command fails with below error

command used:

ngcc --properties es2015 browser module main --first-only --create-ivy-entry-points

Error:

> Compiling @angular/cdk/stepper : es2015 as esm2015
> Compiling @angular/cdk/drag-drop : es2015 as esm2015
> Error: Error on worker #3: Error: Tried to overwrite node_modules/@angular/cdk/stepper/step-header.d.ts.__ivy_ngcc_bak with an ngcc back up file, which is disallowed.
>     at NewEntryPointFileWriter.InPlaceFileWriter.writeFileAndBackup (node_modules/@angular/compiler-cli/ngcc/src/writing/in_place_file_writer.js:37:23)
>     at NewEntryPointFileWriter.writeFile (node_modules/@angular/compiler-cli/ngcc/src/writing/new_entry_point_file_writer.js:64:53)
>     at node_modules/@angular/compiler-cli/ngcc/src/writing/new_entry_point_file_writer.js:46:69
>     at Array.forEach (<anonymous>)
>     at NewEntryPointFileWriter.writeBundle (node_modules/@angular/compiler-cli/ngcc/src/writing/new_entry_point_file_writer.js:46:30)
>     at ClusterWorker.compile (node_modules/@angular/compiler-cli/ngcc/src/main.js:173:32)
>     at Worker.<anonymous> (node_modules/@angular/compiler-cli/ngcc/src/execution/cluster/worker.js:44:42)
>     at Worker.emit (events.js:321:20)
>     at process.<anonymous> (internal/cluster/worker.js:32:12)
>     at process.emit (events.js:321:20)
>     at ClusterMaster.onWorkerMessage (node_modules/@angular/compiler-cli/ngcc/src/execution/cluster/master.js:158:27)
>     at node_modules/@angular/compiler-cli/ngcc/src/execution/cluster/master.js:46:95
>     at ClusterMaster.<anonymous> (node_modules/@angular/compiler-cli/ngcc/src/execution/cluster/master.js:238:57)
>     at step (node_modules/tslib/tslib.js:136:27)
>     at Object.next (node_modules/tslib/tslib.js:117:57)
>     at node_modules/tslib/tslib.js:110:75
>     at new Promise (<anonymous>)
>     at Object.__awaiter (node_modules/tslib/tslib.js:106:16)
>     at EventEmitter.<anonymous> (node_modules/@angular/compiler-cli/ngcc/src/execution/cluster/master.js:232:32)
>     at EventEmitter.emit (events.js:321:20)

Radiobroadcast

Answer 1

Make sure to clean your workspace after upgrading to angular 9 and reinstall all packages/dependencies. It actually resolved most of my errors.

Cleaning workspace by deleting node_modules folder, package_lock.json and reinstalling all packages by npm install resolved most of the issues

• Delete your node_modules folder
• Delete package_lock.json
• Reinstall packages after deleteing with npm install

Radiobroadcast

Ah, the good old "Burn everything to the ground and continue as if nothing happened"-technique. Works (almost) every time. – Gannes

deleting node_modules should suffice (as long as you didn't change package_lock.json manually) – Sump

Answer 2

Turning enableIvy off, did work for me.

from tsconfig file, under angularCompilerOptions

add "enableIvy": false

Surmise

Requires ng-zorro-antd v9.0.2+ acording to github.com/NG-ZORRO/ng-zorro-antd/issues/4236 – Chinfest

This will compile but will render a blank page with error - Complier not found – Annulus

This worked for me - in my case the problem was casues by a library linked with npm link – Socialize

Ouch! It seemed to work cause it compiled but throw an error un execution time with the injector :-( – Socialize

Error: inject() must be called from an injection context – Socialize

I had to configure preserveSymlinks: true in angular.json but still not working perfectly, definitely npm link has some issues in complex scenarios :( – Socialize

Answer 3

In my case I had a Angular 11 library used inside a consumer app using npm link command.

I was getting the error running npm start in the the consumer app. The fix for me was this in library's tsconfig.json (was "false" before).

angularCompilerOptions": 
{
    "enableIvy": true 
}

Interesting how this fix is the opposite of the one for Angular 9 mentioned above by @Ahmed El-Araby, maybe because in Angular 11 Ivy is enabled by default

Covering

Answer 4

In the /dist directory delete all files *.__ivy_ngcc_bak and the directory ivy_ngcc, and run ng build again. It works fine for me.

Circlet