Errors after npm audit fix angular 10.0.1

Question

I ran this older 10.0.1 angular project today, and it told me it had a lot of low vulnerabilities and a few high ones. so i ran npm audit fix to fix them. but now when I try to run it, it gives me these errors:

Error: ./src/main.ts  
Module build failed (from ./node_modules/@ngtools/webpack/src/ivy/index.js):
TypeError: angularCompiler.getResourceDependencies(...) is not a function or its return value is not iterable
    at getDependencies (C:\Web\vgc\vgc\node_modules\@ngtools\webpack\src\ivy\plugin.js:261:56)
    at C:\Web\vgc\vgc\node_modules\@ngtools\webpack\src\ivy\plugin.js:374:20
    at analyzingFileEmitter (C:\Web\vgc\vgc\node_modules\@ngtools\webpack\src\ivy\plugin.js:307:20)
    at process._tickCallback (internal/process/next_tick.js:68:7)



Error: ./src/polyfills.ts  
Module build failed (from ./node_modules/@ngtools/webpack/src/ivy/index.js):
TypeError: angularCompiler.getResourceDependencies(...) is not a function or its return value is not iterable
    at getDependencies (C:\Web\vgc\vgc\node_modules\@ngtools\webpack\src\ivy\plugin.js:261:56)
    at C:\Web\vgc\vgc\node_modules\@ngtools\webpack\src\ivy\plugin.js:374:20
    at analyzingFileEmitter (C:\Web\vgc\vgc\node_modules\@ngtools\webpack\src\ivy\plugin.js:307:20)
    at process._tickCallback (internal/process/next_tick.js:68:7)

Any ideas how to fix this? I couldn't really find any relatable problems or solutions online.

`nom audit fix` updates dependencies. Sometimes updated libraries are not compatible with other libraries or with your angular setup. Make sure you are using correct webpack version. — Kshitij, Jan 22 '21 at 17:28
Thanks for the answer, it indeed had to do something with compatibility problems. I updated the webpack library which fixed it but gave me some more pretty unexplickable errors. I tried fixing it for a bit but in the end I did the smart thing and saved myself the hassle by just copying everything over to a new clean project which works fine now. — RTman, Jan 22 '21 at 19:42
I'm facing the same problem. It started happening after installing `tailwind` on a fresh NX installation, I tried installing both `4` and `5` of webpack versions. no luck so far, any advice here? thanks. — Cristian Martinez, Jan 25 '21 at 19:26
I also noticed that `webpack` version didn't change after the installation of the package mentioned above, so it might be something else. webpack version: `4.43.0` — Cristian Martinez, Jan 25 '21 at 19:38

score 52 · Accepted Answer · edited Feb 02 '21 at 02:37

52

Upgrading the Angular CLI from 10 to 11 works for me.

ng update @angular/core @angular/cli
ng update

edited Feb 02 '21 at 02:37

Craig

390
3
13

answered Jan 27 '21 at 20:43

Пазюк Олександр

544
4
2

Updating to Angular 11 also solved the issue for me. Note that the command above will always update to the newest version – skappler Jan 28 '21 at 09:29
Perfect after doing a lot of things this works for me. – Nikhil Jan 29 '21 at 02:08
This did work for me, on reflection however, I should have tried tried Darshan's answer first of removing installed packages and doing a fresh package install. Fortunately, I do not have any other angular projects to be concerned about. – Craig Feb 01 '21 at 14:17
It's not really an option when you have to keep the Angular version constant to maximise inter-project compatibility of components – John White Feb 18 '21 at 13:09

score 6 · Answer 2 · edited Jan 27 '21 at 13:26

6

TRY this one

rm -rf node_modules/
npm install
npm run build

edited Jan 27 '21 at 13:26

Random

3,158
1
15
25

answered Jan 25 '21 at 11:24

Darshan Malani

478
3
12

2

You may also do `npm start` or any of your build script (instead of `npm run build`), which builds or serves your app. – Random Jan 28 '21 at 08:06

score 2 · Answer 3 · answered Apr 06 '21 at 08:54

I have also fixed the same issue. The main reason was the "@angular-devkit/build-angular" version which is not matching in my case. I changed it's version compatible angular version. In my case I am using angular 10 and previously the version started with "0.11" and I changed it to "0.1002.3".

user15276771 · Answer 4 · 2021-02-24T16:51:13.250

1

Try this:

rmdir /s node_modules
npm install "or" npm install @angular-devkit/build-angular
npm run build

edited Feb 24 '21 at 16:51

answered Feb 24 '21 at 16:42

user15276771

11
2

2

"Try this" does not make for a good answer. You should explain *how* and *why* this solves their problem. I recommend reading, "[How do I write a good answer?"](//stackoverflow.com/help/how-to-answer) – John Conde Feb 24 '21 at 20:35

score 1 · Answer 5 · answered Mar 10 '21 at 10:31

I faced the same problem. What I did to successfully fix the problem:

git restore package-lock.json
git restore package.json
rm -rf node_modules/
npm install
npm start

The reasons of the steps: 1.2. steps to restore the origin package file 3 step to delete all the installed dependencies 4 step to install the dependencies again after all, it restores to the origin status, it works.

score 1 · Answer 6 · answered Jun 15 '21 at 01:30

My clients make us be on a certain version, that they have approved. This is v10 for me.

I ran the below to solve this issue, after I inspected the appropriate package.json

npm i @angular-devkit/build-angular@0.1002.0 @angular-devkit/architect@0.1002.0 @angular-devkit/build-optimizer@0.1002.0 @angular-devkit/core@10.2.0 @angular-devkit/schematics@10.2.0 --save

score 0 · Answer 7 · answered Mar 19 '21 at 13:25

You can resolve this problem by Upgrading the Angular CLI version from 10 to 11. as #Craig answer.

or else, remove node_modules, package-lock.json file.

restore old package.json file and then run npm install. or don't do npm audit fix.

npm audit fix upgrades/modifies package dependencies, that's so made error.

score 0 · Answer 8 · answered May 12 '21 at 05:00

you should try this

ng update @angular/cli @angular/core --allow-dirty --force

I tried this before but that does not allow to update in windows os

ng update @angular/cli @angular/core

or

ng update @angular/cli @angular/core --allow-dirty

that's problem create beacuse of .\Temp\ng-fmB0C2\angular-errors.log

score 0 · Answer 9 · answered May 21 '21 at 12:42

In addition to all of the above, have to do an extra step:

check if there is a duplicate versions of webpack, don't know how it was introduced though. The tree looked:

+-- @angular-devkit/build-angular@12.0.0 -- webpack@5.36.2 -- webpack@5.36.2

If so, fixed by( https://docs.npmjs.com/cli/v7/commands/npm-dedupe ):

npm dedupe

score 0 · Answer 10 · answered Nov 11 '21 at 11:56

0

My problem was caused by

"preserveSymlinks": true,

missing from the angular.json in the options for my build.

answered Nov 11 '21 at 11:56

Razze

4,124
3
16
23

score -1 · Answer 11 · answered Apr 11 '21 at 07:41

-1

In my case problem gone resolved after installing the below package.

npm install @ngtools/webpack

answered Apr 11 '21 at 07:41

Safyan Yaqoob

444
3
11

score -1 · Answer 12 · answered May 21 '21 at 12:54

-1

For my case, I ran ng update @angular/cli@^11 @angular/core@^11

Then install webpack@4 since other package has dependencies on it.

Then install tapable & @types/webpack since webpack 4 plugin needs it.

.. and few times remove node_modules & npm install :)

answered May 21 '21 at 12:54

mr.sk1p

1
1

Hello. Can we see your error logs? That would help shine light on the problem you are facing. – mondieki May 23 '21 at 16:27
Hello. Thank you for your concern. My problem is solved by now. Tq again – mr.sk1p May 25 '21 at 13:52

Errors after npm audit fix angular 10.0.1

12 Answers12

Linked