Module build failed (from ./node_modules/@angular-devkit/build-optimizer/src/build-optimizer/webpack-loader.js)
Many times, we add multiple dependencies into our angular
application and get done our things. Mostly our angular app just runs fine, when
we do ng serve. but, sometimes it fails when we try to build using ng build - - prod
command.
Following is the example of the same. We have added a few packages into
our application and it worked fine but when we are trying to build the application,
we got the following error.
PS D:\Angular-DemoApps\Angular 8 - prime
ng> ng build --prod
ERROR in ./node_modules/primeng/fesm5/primeng-autocomplete.js
Module build failed (from
./node_modules/@angular-devkit/build-optimizer/src/build-optimizer/webpack-loader.js):
TypeError: Cannot read property 'kind'
of undefined
at isAngularDecoratorMetadataExpression (D:\Angular-DemoApps\Angular 8 -
prime
ng\node_modules\@angular-devkit\build-optimizer\src\transforms\scrub-file.js:265:35)
at checkNodeForDecorators (D:\Angular-DemoApps\Angular 8 - prime
ng\node_modules\@angular-devkit\build-optimizer\src\transforms\scrub-file.js:77:21)
at visitNodes (D:\Angular-DemoApps\Angular 8 - prime
ng\node_modules\@angular-devkit\build-optimizer\node_modules\typescript\lib\typescript.js:16514:30)
at Object.forEachChild (D:\Angular-DemoApps\Angular 8 - prime
ng\node_modules\@angular-devkit\build-optimizer\node_modules\typescript\lib\typescript.js:16740:24)
at checkNodeForDecorators (D:\Angular-DemoApps\Angular 8 - prime
ng\node_modules\@angular-devkit\build-optimizer\src\transforms\scrub-file.js:68:31)
at visitNode (D:\Angular-DemoApps\Angular 8 - prime
ng\node_modules\@angular-devkit\build-optimizer\node_modules\typescript\lib\typescript.js:16505:24)
at Object.forEachChild (D:\Angular-DemoApps\Angular 8 - prime
ng\node_modules\@angular-devkit\build-optimizer\node_modules\typescript\lib\typescript.js:16635:21)
at checkNodeForDecorators (D:\Angular-DemoApps\Angular 8 - prime
ng\node_modules\@angular-devkit\build-optimizer\src\transforms\scrub-file.js:68:31)
at visitNode (D:\Angular-DemoApps\Angular 8 - prime
ng\node_modules\@angular-devkit\build-optimizer\node_modules\typescript\lib\typescript.js:16505:24)
at Object.forEachChild (D:\Angular-DemoApps\Angular 8 - prime
ng\node_modules\@angular-devkit\build-optimizer\node_modules\typescript\lib\typescript.js:16692:24)
at checkNodeForDecorators (D:\Angular-DemoApps\Angular 8 - prime
ng\node_modules\@angular-devkit\build-optimizer\src\transforms\scrub-file.js:68:31)
at visitNode (D:\Angular-DemoApps\Angular 8 - prime
ng\node_modules\@angular-devkit\build-optimizer\node_modules\typescript\lib\typescript.js:16505:24)
at Object.forEachChild (D:\Angular-DemoApps\Angular 8 - prime
ng\node_modules\@angular-devkit\build-optimizer\node_modules\typescript\lib\typescript.js:16703:24)
at checkNodeForDecorators (D:\Angular-DemoApps\Angular 8 - prime
ng\node_modules\@angular-devkit\build-optimizer\src\transforms\scrub-file.js:68:31)
at visitNode (D:\Angular-DemoApps\Angular 8 - prime
ng\node_modules\@angular-devkit\build-optimizer\node_modules\typescript\lib\typescript.js:16505:24)
at Object.forEachChild (D:\Angular-DemoApps\Angular 8 - prime
ng\node_modules\@angular-devkit\build-optimizer\node_modules\typescript\lib\typescript.js:16599:21)
ERROR in ./node_modules/primeng/fesm5/primeng-button.js
Module build failed (from
./node_modules/@angular-devkit/build-optimizer/src/build-optimizer/webpack-loader.js):
TypeError: Cannot read property 'kind'
of undefined
at isAngularDecoratorMetadataExpression (D:\Angular-DemoApps\Angular 8 -
prime
ng\node_modules\@angular-devkit\build-optimizer\src\transforms\scrub-file.js:265:35)
at checkNodeForDecorators (D:\Angular-DemoApps\Angular 8 - prime
ng\node_modules\@angular-devkit\build-optimizer\src\transforms\scrub-file.js:77:21)
at visitNodes (D:\Angular-DemoApps\Angular 8 - prime
ng\node_modules\@angular-devkit\build-optimizer\node_modules\typescript\lib\typescript.js:16514:30)
at Object.forEachChild (D:\Angular-DemoApps\Angular 8 - prime
ng\node_modules\@angular-devkit\build-optimizer\node_modules\typescript\lib\typescript.js:16740:24)
at checkNodeForDecorators (D:\Angular-DemoApps\Angular 8 - prime
ng\node_modules\@angular-devkit\build-optimizer\src\transforms\scrub-file.js:68:31)
at visitNode (D:\Angular-DemoApps\Angular 8 - prime
ng\node_modules\@angular-devkit\build-optimizer\node_modules\typescript\lib\typescript.js:16505:24)
at Object.forEachChild (D:\Angular-DemoApps\Angular 8 - prime
ng\node_modules\@angular-devkit\build-optimizer\node_modules\typescript\lib\typescript.js:16635:21)
at checkNodeForDecorators (D:\Angular-DemoApps\Angular 8 - prime
ng\node_modules\@angular-devkit\build-optimizer\src\transforms\scrub-file.js:68:31)
at visitNode (D:\Angular-DemoApps\Angular 8 - prime ng\node_modules\@angular-devkit\build-optimizer\node_modules\typescript\lib\typescript.js:16505:24)
at Object.forEachChild (D:\Angular-DemoApps\Angular 8 - prime
ng\node_modules\@angular-devkit\build-optimizer\node_modules\typescript\lib\typescript.js:16692:24)
at checkNodeForDecorators
(D:\Angular-DemoApps\Angular 8 - prime
ng\node_modules\@angular-devkit\build-optimizer\src\transforms\scrub-file.js:68:31)
at visitNode (D:\Angular-DemoApps\Angular 8 - prime
ng\node_modules\@angular-devkit\build-optimizer\node_modules\typescript\lib\typescript.js:16505:24)
at Object.forEachChild (D:\Angular-DemoApps\Angular 8 - prime
ng\node_modules\@angular-devkit\build-optimizer\node_modules\typescript\lib\typescript.js:16703:24)
at checkNodeForDecorators (D:\Angular-DemoApps\Angular 8 - prime
ng\node_modules\@angular-devkit\build-optimizer\src\transforms\scrub-file.js:68:31)
at visitNode (D:\Angular-DemoApps\Angular 8 - prime
ng\node_modules\@angular-devkit\build-optimizer\node_modules\typescript\lib\typescript.js:16505:24)
at Object.forEachChild (D:\Angular-DemoApps\Angular 8 - prime
ng\node_modules\@angular-devkit\build-optimizer\node_modules\typescriERROR in
./node_modules/primeng/fesm5/primeng-inputtext.js
Module build failed (from
./node_modules/@angular-devkit/build-optimizer/src/build-optimizer/webpack-loader.js):
TypeError: Cannot read property 'kind'
of undefined
at isAngularDecoratorMetadataExpression (D:\Angular-DemoApps\Angular 8 -
prime ng\node_modules\@angular-devkit\build-optimizer\src\transforms\scrub-file.js:265:35)
at checkNodeForDecorators (D:\Angular-DemoApps\Angular 8 - prime
ng\node_modules\@angular-devkit\build-optimizer\src\transforms\scrub-file.js:77:21)
at visitNodes (D:\Angular-DemoApps\Angular 8 - prime
ng\node_modules\@angular-devkit\build-optimizer\node_modules\typescript\lib\typescript.js:16514:30)
at Object.forEachChild (D:\Angular-DemoApps\Angular 8 - prime
ng\node_modules\@angular-devkit\build-optimizer\node_modules\typescript\lib\typescript.js:16740:24)
at checkNodeForDecorators (D:\Angular-DemoApps\Angular 8 - prime
ng\node_modules\@angular-devkit\build-optimizer\src\transforms\scrub-file.js:68:31)
After some study we understand, the problem is with non-updated/ non-installed
packages/dependencies.
To resolve that problem, we have multiple ways, the following are a few
ways.
1. Manage dependencies
by your own
Go to package.json
and check the version of your dependencies, your dev dependencies should be
compatible with each other or cli
version.
In our case we have
downgraded devkit dependency from .19 to .8 as shown below.
"@angular-devkit/build-angular": "~0.803.8"
2. Let npm manage
the dependencies for you, just use npm update command to achieve
dependency management.
So, we just updated
the project with npm update command and worked just fine.
PS D:\Angular-DemoApps\Angular
8 - prime ng> npm update
> node-sass@4.13.0 install D:\Angular-DemoApps\Angular
8 - prime ng\node_modules\node-sass
> node scripts/install.js
Downloading binary from
https://github.com/sass/node-sass/releases/download/v4.13.0/win32-x64-64_binding.node
Download complete ] - :
Binary saved to D:\Angular-DemoApps\Angular
8 - prime ng\node_modules\node-sass\vendor\win32-x64-64\binding.node
Caching binary to C:\Users\username\AppData\Roaming\npm-cache\node-sass\4.13.0\win32-x64-64_binding.node
> node-sass@4.13.0 postinstall D:\Angular-DemoApps\Angular
8 - prime ng \node_modules\node-sass
> node scripts/build.js
Binary found at D:\Angular-DemoApps\Angular
8 - prime ng\node_modules\node-sass\vendor\win32-x64-64\binding.node
Testing binary
Binary is fine
npm WARN ng-pick-datetime@7.0.0
requires a peer of @angular/cdk@^7.0.0 but none is installed. You must install
peer dependencies yourself.
npm WARN ngx-toastr@11.2.1 requires a
peer of rxjs@^6.5.0 but none is installed. You must install peer dependencies
yourself.
npm WARN bootstrap@4.4.0 requires a
peer of jquery@1.9.1 - 3 but none is installed. You must install peer
dependencies yourself.
npm WARN bootstrap@4.4.0 requires a
peer of popper.js@^1.16.0 but none is installed. You must install peer
dependencies yourself.
npm WARN @angular/animations@8.2.14
requires a peer of @angular/core@8.2.14 but none is installed. You must install
peer dependencies yourself.
npm WARN optional SKIPPING OPTIONAL
DEPENDENCY: fsevents@1.2.9 (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL
DEPENDENCY: Unsupported platform for fsevents@1.2.9: wanted
{"os":"darwin","arch":"any"} (current:
{"os":"win32","arch":"x64"})
+ codelyzer@5.2.0
+ ngx-toastr@11.2.1
+ @angular/cdk@8.2.3
+ @types/jasmine@3.3.16
+ node-sass@4.13.0
+ @angular/material@8.2.3
+ bootstrap@4.4.0
+ @angular/animations@8.2.14
+ @types/jasminewd2@2.0.8
removed 1 package, updated 11
packages and audited 19734 packages in 64.014s
found 10 vulnerabilities (1 moderate,
9 high)
run `npm audit fix` to fix them, or `npm audit` for details
3. If you are unable to resolve the problem that
means our dependency is missing so we should have to install it.
We can use npm install command to install all missing dependencies
So, we just installed
the dependencies in our project with npm install command and worked just
fine.
PS D D:\Angular-DemoApps\Angular
8 - prime ng > npm install
npm WARN deprecated core-js@2.6.10:
core-js@<3.0 is no longer maintained and not recommended for usage due to
the number of issues. Please, upgrade your dependencies to the actual version
of core-js@3.
> core-js@2.6.10 postinstall D:\Angular-DemoApps\Angular
8 - prime ng \node_modules\babel-runtime\node_modules\core-js
> node postinstall || echo
"ignore"
Thank you for using core-js (
https://github.com/zloirock/core-js ) for polyfilling JavaScript standard
library!
The project needs your help! Please
consider supporting of core-js on Open Collective or Patreon:
>
https://opencollective.com/core-js
> https://www.patreon.com/zloirock
Also, the author of core-js (
https://github.com/zloirock ) is looking for a good job -)
> core-js@3.2.1 postinstall D:\Angular-DemoApps\Angular
8 - prime ng \node_modules\core-js
> node scripts/postinstall || echo
"ignore"
Thank you for using core-js (
https://github.com/zloirock/core-js ) for polyfilling JavaScript standard
library!
The project needs your help! Please
consider supporting of core-js on Open Collective or Patreon:
>
https://opencollective.com/core-js
> https://www.patreon.com/zloirock
Also, the author of core-js (
https://github.com/zloirock ) is looking for a good job -)
npm WARN rollback Rolling back
node-pre-gyp@0.12.0 failed (this is probably harmless): EPERM: operation not
permitted, scandir D:\Angular-DemoApps\Angular 8 - prime ng\node_modules\fsevents\node_modules'
npm WARN @angular/animations@8.2.14
requires a peer of @angular/core@8.2.14 but none is installed. You must install
peer dependencies yourself.
npm WARN bootstrap@4.4.0 requires a
peer of jquery@1.9.1 - 3 but none is installed. You must install peer
dependencies yourself.
npm WARN bootstrap@4.4.0 requires a
peer of popper.js@^1.16.0 but none is installed. You must install peer
dependencies yourself.
npm WARN ng-pick-datetime@7.0.0
requires a peer of @angular/cdk@^7.0.0 but none is installed. You must install
peer dependencies yourself.
npm WARN ngx-toastr@11.2.1 requires a
peer of rxjs@^6.5.0 but none is installed. You must install peer dependencies
yourself.
npm WARN optional SKIPPING OPTIONAL
DEPENDENCY: fsevents@1.2.9 (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL
DEPENDENCY: Unsupported platform for fsevents@1.2.9: wanted
{"os":"darwin","arch":"any"} (current:
{"os":"win32","arch":"x64"})
added 243 packages from 79
contributors, removed 12 packages, updated 64 packages and audited 21410
packages in 131.013s
found 10 vulnerabilities (1 moderate,
9 high)
run `npm audit fix` to fix them, or `npm audit` for details
PS D:\Angular-DemoApps\Angular
8 - prime ng>
And that’s it,
Hope you like it.
[ If you are preparing for an interview please click here - angular interview questions and answers ]
Error: [$controller:ctrlreg] in AngularJS Fix.
ReplyDeleteThis comment has been removed by the author.
ReplyDeleteWay 1 helped me.
ReplyDelete👍
Deletefirst one Worked for me
DeleteGreat blog, I was searching this for a while. Do post more like this.
ReplyDeleteAngularJS Training in Chennai
Angular 4 Training in Chennai
Angular 5 Training in Chennai
Angular Training in Chennai
React JS Training in Chennai
PHP course in Chennai
Web Designing Training in Chennai
React JS Training in Chennai
Salesforce course in Chennai
Angular course in Chennai
AngularJS Interview Questions
hi,this page having excellent information.that could help us more.thaks for sharing.
ReplyDeleteC and C++ Training Institute in chennai | C and C++ Training Institute in anna nagar | C and C++ Training Institute in omr | C and C++ Training Institute in porur | C and C++ Training Institute in tambaram | C and C++ Training Institute in velachery
I think I have never seen such blogs ever before that has complete things with all details which I want. So kindly update this ever for us.
ReplyDeleteData Science Course
Well we really like to visit this site, many useful information we can get here.
ReplyDeleteData Science Training
Interesting post. I Have Been wondering about this issue, so thanks for posting. Pretty cool post.It's really very nice and Useful post.Thanks..
ReplyDeleteData Science Courses
The web site is lovingly serviced and saved as much as date. So it should be, thanks for sharing this with us.
ReplyDeleteData Science Certification
Nice articel, I love your today news. Thank You.
ReplyDeleteWonderful blog found to be very impressive to come across such an awesome blog. I should really appreciate the blogger for the efforts they have put in to develop such an amazing content for all the curious readers who are very keen of being updated across every corner. Ultimately, this is an awesome experience for the readers. Anyways, thanks a lot and keep sharing the content in future too.
ReplyDeleteArtificial Intelligence Course in bhilai
Terrific post thoroughly enjoyed reading the blog and more over found to be the tremendous one. In fact, educating the participants with it's amazing content. Hope you share the similar content consecutively.
ReplyDeleteartificial intelligence certification in bhilai
Really wonderful blog completely enjoyed reading and learning to gain the vast knowledge. Eventually, this blog helps in developing certain skills which in turn helpful in implementing those skills. Thanking the blogger for delivering such a beautiful content and keep posting the contents in upcoming days.
ReplyDeleteData Science training
I had same issue and resoved by change the buildOptimizer: fale in angular.json file.
ReplyDeleteJust Change
buildOptimizer: true
To
buildOptimizer: fale
worked for me
Stupendous blog huge applause to the blogger and hoping you to come up with such an extraordinary content in future. Surely, this post will inspire many aspirants who are very keen in gaining the knowledge. Expecting many more contents with lot more curiosity further.
ReplyDeleteData Science training in Raipur
Extraordinary blog went amazed with the content that they have developed in a very descriptive manner. This type of content surely ensures the participants to explore themselves. Hope you deliver the same near the future as well. Gratitude to the blogger for the efforts.
ReplyDeleteDigital Marketing training in Raipur
Terrific post thoroughly enjoyed reading the blog and more over found to be the tremendous one. In fact, educating the participants with it's amazing content. Hope you share the similar content consecutively.
ReplyDeleteData Science certification in Bhilai
Tremendous blog quite easy to grasp the subject since the content is very simple to understand. Obviously, this helps the participants to engage themselves in to the subject without much difficulty. Hope you further educate the readers in the same manner and keep sharing the content as always you do.
ReplyDeleteDigital Marketing training in Bhilai
Stupendous blog huge applause to the blogger and hoping you to come up with such an extraordinary content in future. Surely, this post will inspire many aspirants who are very keen in gaining the knowledge. Expecting many more contents with lot more curiosity further.
ReplyDeleteData Science certification in Raipur
Truly mind blowing blog went amazed with the subject they have developed the content. These kind of posts really helpful to gain the knowledge of unknown things which surely triggers to motivate and learn the new innovative contents. Hope you deliver the similar successive contents forthcoming as well.
ReplyDeleteDigital Marketing Course in Raipur
Extraordinary blog filled with an amazing content which no one has touched this subject before. Thanking the blogger for all the terrific efforts put in to develop such an awesome content. Expecting to deliver similar content further too and keep sharing as always.
ReplyDeleteDigital Marketing Course
bro i love you , thanks so much
ReplyDeleteStupendous blog huge applause to the blogger and hoping you to come up with such an extraordinary content in future. Surely, this post will inspire many aspirants who are very keen in gaining the knowledge. Expecting many more contents with lot more curiosity further.
ReplyDeleteData Science Certification in Bhilai
Extraordinary blog filled with an amazing content which no one has touched this subject before. Thanking the blogger for all the terrific efforts put in to develop such an awesome content. Expecting to deliver similar content further too and keep sharing as always.
ReplyDeleteData Science Training
Impressive blog to be honest definitely this post will inspire many more upcoming aspirants. Eventually, this makes the participants to experience and innovate themselves through knowledge wise by visiting this kind of a blog. Once again excellent job keep inspiring with your cool stuff.
ReplyDeleteData Science Training in Bhilai
Extraordinary blog went amazed with the content that they have developed in a very descriptive manner. This type of content surely ensures the participants to explore themselves. Hope you deliver the same near the future as well. Gratitude to the blogger for the efforts.
ReplyDeleteData Science Training
Great blog with valuable information.
ReplyDeleteREST API Testing Online Training
REST API Testing Training in Chennai
REST API Testing Training in Bangalore
Wonderful blog found to be very impressive to come across such an awesome blog. I should really appreciate the blogger for the efforts they have put in to develop such amazing content for all the curious readers who are very keen on being updated across every corner. Ultimately, this is an awesome experience for the readers. Anyways, thanks a lot and keep sharing the content in future too.
ReplyDeleteData Science Course in Bhilai
Strong network security starts with a smart setup. If possible, place your router at the center of your home. Routers send wireless signals Wifi Hacking Online
ReplyDeleteA lot of people are looking to download Pandora Premium Mod Apk 2022. If you are also one of them then keep reading this article Pandora One Free Download
ReplyDeleteI have not only given my heart away to you, I have also dedicated and given away my soul, my prayers and my very being to you. I don't have anything else left Love Husband Good Morning
ReplyDelete