Error- Cannot find module @angular-devkit/build-angular/package.json

Issue Description:

Angular 9 build ng serve commands gives below error,

An unhandled exception occurred: Cannot find module ‘@angular-devkit/build-angular/package.json’

Resolution

This issue I found to be some mismatch on framework packages when I recently upgraded the Angular CLI to Angular 9. This error could also be producible due to other reasons.

After initial trivial, I was able to resolve the issue by following below steps and series of commands,

Ideally below commands should fix this error but in case if the issue still persists please try using other below commands.

npm install --save-dev @angular-devkit/build-angular

If the above commands don’t fix the issue, please try the below steps.

  • Delete node_module folder manually from local project directory

npm rm -rf node_modules
  • Delete package-lock.json file. (Don’t worry next npm install anyway will create a fresh package-lock.json file.)

package-lock.json

  • Clean NPM cache
npm cache clean --force

If want to use lower Angular version,

Please run below command,

npm install --save-dev @angular/cli@[Your Preferred Version]

Example if you want to use Angular 8 then use below ,

npm install --save-dev @angular/cli@8

If want to use the latest version i.e Angular 9,

npm install --save-dev @angular/cli@latest

  • Re-install NPM packages,

The please reinstall npm both globally and locally to the project directory,

npm install -g npm@latest
npm install

For any error, please keep the below command handy additionally if needed,

npm install @angular/compiler-cli 

Or

npm install @angular/compiler

Or

npm install angular/compiler-cli/ngcc

Or

npm install --save-dev @angular-devkit/build-angular

You might see different issues if trying to migrate from an older like Angular 5,6,7 to a new Version.

If you need to perform any old framework migration like Angular 6 or 7 then you must migrate the application to Angular 8 first and use migration guidelines to migrate the application to Angular 9.

However for me, the issue fix was simple.

Finally application launches successfully

Additional References:


What Is Angular-DevKit?

DevKit provides a large set of libraries that are used to manage, develop, deploy and analyze code. Angular CLI is built on the top of Angular DevKit

Angular DevKit provides the below set of packages and tools which are very helpful means for managing, deploying, and developing code.

  • @angular-devkit/architect
  • @angular-devkit/build-angular
  • @angular-devkit/build-ng-packagr
  • @angular-devkit/build-optimizer
  • @angular-devkit/build-webpack
  • @angular-devkit/core
  • @angular-devkit/schematics

Did the above steps resolved your issue?

Please sound off in the comments below!



Please bookmark this page and share it with your friends. Please Subscribe to the blog to receive notifications on freshly published(2024) best practices and guidelines for software design and development.



15 thoughts on “Cannot find module @angular-devkit/build-angular/package.json

  1. I did work for me ! But I am not sure if I did anything different. I kept on trying the few commands mentioned above and the issue got fixed

  2. This error appears to me
    CREATE my-dream-app/README.md (1028 bytes)
    CREATE my-dream-app/tsconfig.json (458 bytes)
    CREATE my-dream-app/tslint.json (3185 bytes)
    CREATE my-dream-app/.editorconfig (274 bytes)
    CREATE my-dream-app/.gitignore (631 bytes)
    CREATE my-dream-app/.browserslistrc (853 bytes)
    CREATE my-dream-app/karma.conf.js (1024 bytes)
    CREATE my-dream-app/tsconfig.app.json (287 bytes)
    CREATE my-dream-app/tsconfig.spec.json (333 bytes)
    CREATE my-dream-app/src/favicon.ico (948 bytes)
    CREATE my-dream-app/src/index.html (296 bytes)
    CREATE my-dream-app/src/main.ts (372 bytes)
    CREATE my-dream-app/src/polyfills.ts (2835 bytes)
    CREATE my-dream-app/src/styles.css (80 bytes)
    CREATE my-dream-app/src/test.ts (753 bytes)
    CREATE my-dream-app/src/assets/.gitkeep (0 bytes)
    CREATE my-dream-app/src/environments/environment.prod.ts (51 bytes)
    CREATE my-dream-app/src/environments/environment.ts (662 bytes)
    CREATE my-dream-app/src/app/app-routing.module.ts (245 bytes)
    CREATE my-dream-app/src/app/app.module.ts (393 bytes)
    CREATE my-dream-app/src/app/app.component.html (25757 bytes)
    CREATE my-dream-app/src/app/app.component.spec.ts (1075 bytes)
    CREATE my-dream-app/src/app/app.component.ts (216 bytes)
    CREATE my-dream-app/src/app/app.component.css (0 bytes)
    CREATE my-dream-app/e2e/protractor.conf.js (869 bytes)
    CREATE my-dream-app/e2e/tsconfig.json (294 bytes)
    CREATE my-dream-app/e2e/src/app.e2e-spec.ts (645 bytes)
    CREATE my-dream-app/e2e/src/app.po.ts (301 bytes)
    | Installing packages…

    1. Hi Zxc- Could you please post your error. I don’t see any error code in the code you posted. Also please confirm your Angular version. Thanks.

  3. I just ran all of these commands. Then ran this to fix the ng not found: npm link @angular/cli

    Then I ran npm run build-dev and am back to the original error:
    Cannot find module ‘@angular-devkit/build-angular/package.json’

  4. Hello. I followed your instructions and I’m still getting the following error:

    An unhandled exception occurred: Cannot find module ‘@angular/compiler-cli/ngcc’
    Require stack:
    – \node_modules\@ngtools\webpack\src\ngcc_processor.js
    – \node_modules\@ngtools\webpack\src\angular_compiler_plugin.js
    – \node_modules\@ngtools\webpack\src\index.js
    .
    .

  5. Performed the above but still getting the below, tearing my hair out!!

    An unhandled exception occurred: Cannot find module ‘@angular/compiler-cli’

    Require stack:
    [cc lang=”html”]…@ngtools/webpack/src/angular_compiler_plugin.js
    …@ngtools/webpack/src/index.js
    …@angular-devkit/build-angular/src/angular-cli-files/models/webpack-configs/typescript.js
    …@angular-devkit/build-angular/src/angular-cli-files/models/webpack-configs/index.js
    …@angular-devkit/build-angular/src/browser/index.js
    …@angular-devkit/architect/node/node-modules-architect-host.js
    …@angular-devkit/architect/node/index.js
    …@angular/cli/models/architect-command.js
    …@angular/cli/commands/build-impl.js
    …@angular-devkit/schematics/tools/export-ref.js
    …@angular-devkit/schematics/tools/index.js
    …@angular/cli/utilities/json-schema.js
    …@angular/cli/models/command-runner.js
    …@angular/cli/lib/cli/index.js
    …@angular/cli/lib/init.js
    …@angular/cli/bin/ng[/cc]

  6. This issue was hindering me almost for a week! Performed the above step plus a few additional commands and it worked. Thanks.

      1. Hello Mirna,

        Could you please let me know if you are getting any specific errors?

        I hope you tried all the above steps mentioned. I do see these errors are not common on all machines.

Leave a Reply

Your email address will not be published. Required fields are marked *