I get this error:Cannot find module '@angular-devkit/build-angular/package.json when I try run my app with ng serve from Linux

Question

hello guys I have this next error when I try run my App from the terminal(linux), when I run this command:

ng serve

and I get this error in my terminal:

AppBlog/blog# ng serve
An unhandled exception occurred: Cannot find module '@angular-devkit/build-angular/package.json'
Require stack:
- /usr/local/lib/node_modules/@angular/cli/node_modules/@angular-devkit/architect/node/node-modules-architect-host.js
- /usr/local/lib/node_modules/@angular/cli/node_modules/@angular-devkit/architect/node/index.js
- /usr/local/lib/node_modules/@angular/cli/models/architect-command.js
- /usr/local/lib/node_modules/@angular/cli/commands/serve-impl.js
- /usr/local/lib/node_modules/@angular/cli/node_modules/@angular-devkit/schematics/tools/export-ref.js
- /usr/local/lib/node_modules/@angular/cli/node_modules/@angular-devkit/schematics/tools/index.js
- /usr/local/lib/node_modules/@angular/cli/utilities/json-schema.js
- /usr/local/lib/node_modules/@angular/cli/models/command-runner.js
- /usr/local/lib/node_modules/@angular/cli/lib/cli/index.js
- /usr/local/lib/node_modules/@angular/cli/lib/init.js
- /usr/local/lib/node_modules/@angular/cli/bin/ng
See "/tmp/ng-ev5aDi/angular-errors.log" for further details.

then i checked out this part :

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

this part say that cannot find moduled called: "'@angular-devkit/build-angular/package.json'"

then I cheked out this file in my project but I have this, look:

  "devDependencies": {
    "@angular-devkit/build-angular": "~0.900.3",
    "@angular/cli": "~9.0.3",
    "@angular/compiler-cli": "~9.0.2",
    "@angular/language-service": "~9.0.2",
    "@types/node": "^12.11.1",
    "@types/jasmine": "~3.5.0",
    "@types/jasminewd2": "~2.0.3",
    "codelyzer": "^5.1.2",
    "jasmine-core": "~3.5.0",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "~4.3.0",
    "karma-chrome-launcher": "~3.1.0",
    "karma-coverage-istanbul-reporter": "~2.1.0",
    "karma-jasmine": "~2.0.1",
    "karma-jasmine-html-reporter": "^1.4.2",
    "protractor": "~5.4.3",
    "ts-node": "~8.3.0",
    "tslint": "~5.18.0",
    "typescript": "~3.7.5"
  }

then i went to google and search and I found this like from stackoverflow and I tried their solution but it does not work and I run the command ng serve again.

what I did wrong?

before nothing , before I added 3 components: login,register and home in my folder : src/app with this command : ng generate component login and I import my component in my file : app.component.ts this way:

/* THIS IS JUST A EXAMPLE VERY SIMILAR TO MY CODE REAL,  I just import one component*/

import { Component } from '@angular/core';
import { loginComponent } from './login.component';
@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css'],
  declarations: [loginComponent], //import my login
})
export class AppComponent {
  title = 'blog';
}

maybe is this part but I dont find a solution, any expert in angular could tell me what I did wrong?

UPDATE

I am continue searching in google and I found this: github/Angular they are saying that I would install npm/angular-cli/node again and I run this command for update my angular cli:

uninstalled ang-cli

npm uninstall @angular/cli

installed the latest

npm install -g @angular/cli@latest

but first I update my npm with this command:

installed the latest npm

npm install -g npm@latest

but it still does not work.

did you try reinstalling the module? Also downgrade to a version below and check — prosper1, Feb 25 '20 at 23:44
@prosper1 when I try update or reinstall the module with this next command : npm install --save-dev @angular-devkit/build-angular (https://stackoverflow.com/questions/59136899/an-unhandled-exception-occurred-could-not-find-module-angular-devkit-build-an), I get this error or message i mean : npm install --save-dev @angular-devkit/build-angular — simon, Feb 26 '20 at 00:01
Did you tried to delete the folder "node_modules" and install all the dependencies other time with npm install --save? — beanic, Feb 26 '20 at 09:38

score 18 · Answer 1 · edited Oct 14 '20 at 11:03

18

Please try installing the npm on a project folder. I had installed npm globally but installing the npm once again on a solution folder fixed my issue.

npm install in the project folder will do the trick. Then do ng serve -o

edited Oct 14 '20 at 11:03

Juan Ignacio Avendaño Huergo

409
1
6
15

answered Apr 09 '20 at 09:53

Prem2530

181
3

1

`npm install` in the solution folder will do the trick. Then do `ng serve -o` – Juan Ignacio Avendaño Huergo Jun 28 '20 at 17:35
What does the '-o' do in the 'ng serve -o'? – Evan Sevy Dec 10 '21 at 02:53
1

@EvanSevy opens a browser to the app – mcalex Feb 09 '22 at 03:32

score 14 · Answer 2 · answered Apr 07 '21 at 14:00

14

I finally found something working for me.

Add --force at the end of your npm command.

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

Then ng serve

answered Apr 07 '21 at 14:00

Ben

141
1
3

score 8 · Answer 3 · edited Feb 27 '20 at 10:17

8

In my case these 2 commands helped:

npm install -g npm@latest
npm install -g @angular/cli

edited Feb 27 '20 at 10:17

double-beep

5,031
17
33
41

answered Feb 27 '20 at 09:20

Knut Becker

101
5

score 5 · Answer 4 · answered Apr 21 '20 at 16:54

5

I have faced this issue when i recently upgraded the Angular CLI to Angular 9. the following commands fixed the issue.

npm install --save-dev @angular-devkit/build-angular
npm install
ng serve -o

answered Apr 21 '20 at 16:54

Spider man

3,224
4
30
42

when i do that i get the below error ```npm ERR! Unexpected end of JSON input while parsing near '...@types/node/-/node-6.' npm ERR! A complete log of this run can be found in: npm ERR! C:\Users\rmahapatra\AppData\Roaming\npm-cache\_logs\2020-08-11T11_04_56_358Z-debug.log``` – Rishav Mahapatra Aug 11 '20 at 11:06

score 5 · Answer 5 · answered Jun 08 '21 at 20:20

5

If you are on Angular 11 and facing this issue then please do the following:

Remove "@angular-devkit/build-ng-packagr:build" dependency from devDependencies
Update angular.json->projects->your-library-name -> architect -> build ->

Old:"builder": "@angular-devkit/build-ng-packagr:build",

New:"builder": "@angular-devkit/build-angular:ng-packagr",

answered Jun 08 '21 at 20:20

user2579273

81
2
6

1

I may be on an older version 9. But I used "@angular-devkit/build-ng-packagr:build" here and it worked. Thanks for the hint on the builder within angular.json – TamusJRoyce Aug 09 '21 at 17:01
Thanks, finally to much scrolling to find this answer. Angular team, why not add this in the migrations? – CularBytes Feb 11 '22 at 14:02

score 2 · Answer 6 · answered Jan 20 '21 at 05:18

2

In my case running npm install in project folder solved the problem.

answered Jan 20 '21 at 05:18

Paboda Jay

69
4

score 1 · Answer 7 · answered Sep 16 '20 at 01:48

1

In my case 2 commands helped:

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

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

answered Sep 16 '20 at 01:48

Mohamed A M-Hassan

403
4
10

score 0 · Answer 8 · answered Dec 21 '20 at 15:43

0

Under the project directory run the following command

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

answered Dec 21 '20 at 15:43

M_Vishnureddy

1
1

score 0 · Answer 9 · answered Dec 26 '20 at 21:19

The error states that "Cannot find module '@angular-devkit/build-angular/package.json'" which means you have to have that package added.

install the latest npm

npm install -g npm@latest
add the missing

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

score 0 · Answer 10 · answered Jan 14 '21 at 03:18

Had this exact issue on an existing Angular 10 project. The following steps resolved the issue for me:

Delete the package-lock.json file.
Delete the node_modules folder and all of its contents.
Run npm install. Note that in my case I had to add the --force flag. YMMV

At this point, ng build --prod completed successfully for me.

score 0 · Answer 11 · answered Mar 24 '21 at 09:19

I am Working Angular Project When I update Angular Cli and then I get this error An unhandled exception occurred: Cannot find module '@angular-devkit/build-angular/src/angular-cli-files/models/webpack-configs/utils' Require stack:

C:\codeFlies Development\how_marketsapp\node_modules@ionic\angular-toolkit\builders\utils\index.js
C:\codeFlies Development\how_marketsapp\node_modules@ionic\angular-toolkit\builders\cordova-build\index.js
C:\codeFlies Development\how_marketsapp\node_modules@angular-devkit\architect\node\node-modules-architect-host.js
C:\codeFlies Development\how_marketsapp\node_modules@angular-devkit\architect\node\index.js
C:\codeFlies Development\how_marketsapp\node_modules@angular\cli\models\architect-command.js
C:\codeFlies Development\how_marketsapp\node_modules@angular\cli\commands\run-impl.js
C:\codeFlies Development\how_marketsapp\node_modules@angular\cli\node_modules@angular-devkit\schematics\tools\export-ref.js
C:\codeFlies Development\how_marketsapp\node_modules@angular\cli\node_modules@angular-devkit\schematics\tools\index.js
C:\codeFlies Development\how_marketsapp\node_modules@angular\cli\utilities\json-schema.js
C:\codeFlies Development\how_marketsapp\node_modules@angular\cli\lib\cli\index.js
C:\codeFlies Development\how_marketsapp\node_modules@angular\cli\lib\init.js
C:\codeFlies Development\how_marketsapp\node_modules@angular\cli\bin\ng See "C:\Users\hp\AppData\Local\Temp\ng-UQJuET\angular-errors.log" for further details.

I have resolve this error by using this command

npm i @ionic/angular-toolkit@latest

score 0 · Answer 12 · answered Aug 16 '21 at 21:41

0

In my case I was getting a similar but different error.

Cannot find module '@nguniversal/builders/package.json'

To fix it I had to run

npm install --save-dev @nguniversal/builders

answered Aug 16 '21 at 21:41

James Parker

2,095
3
27
48

score 0 · Answer 13 · answered Aug 23 '21 at 13:55

0

I fixed it using:

npm i --save-dev @angular-devkit/build-angular --force
npm i @angular/compiler-cli --save-dev

answered Aug 23 '21 at 13:55

Oren Levy

11
3

score 0 · Answer 14 · answered Aug 29 '21 at 20:25

0

Earlier following were errors:-

ng serve

Following worked for me: -

npm install npm@latest reinstall without -g

Packages installed successfully

answered Aug 29 '21 at 20:25

S Satyen

31
3

Please, try to avoid using images with code and errors, put it as code in your answer instead – Dmytro Sep 04 '21 at 20:10

score 0 · Answer 15 · edited May 27 '22 at 10:18

It also happened to me, when I ng serve on the cloned code on the company. This happens because there's an error with node modules installation so we need to install it again, build it, and serve it.

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

If the first step above, didn't work because it didn't work to me and receives another error which is: "npm ERR! cb() never called!" I solve this using this command: npm cache clean --force and once this worked, continue to steps 2-3. It worked.

score 0 · Answer 16 · edited Apr 29 '22 at 16:06

0

I personally took 2 days to have a solution for this problem, that was after I upgraded my angular version.

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

It saved my day!

edited Apr 29 '22 at 16:06

Vinay Somawat

639
14
23

answered Apr 27 '22 at 12:20

Meli

31
4

score -1 · Answer 17 · edited Sep 01 '20 at 05:59

-1

npm install run this in your terminal and done.

edited Sep 01 '20 at 05:59

Arghya Sadhu

41,002
9
78
107

answered Aug 31 '20 at 22:21

Behram khan

29
2

I get this error:Cannot find module '@angular-devkit/build-angular/package.json when I try run my app with ng serve from Linux

uninstalled ang-cli

installed the latest

installed the latest npm

17 Answers17

Linked