When upgrading Angular 5 to 6, I get incompatible peer dependency (using ng update @angular/core)

Question

I am trying to update my Angular app from v5 to v6 following this guide.

I have ran all these commands successfully:

npm install -g @angular/cli
npm install @angular/cli
ng update @angular/cli

The problem is that I get an error when running this command:

ng update @angular/core
                  Package "@angular/flex-layout" has an incompatible peer dependency to "rxjs" (requires "^5.5.0", would install "6.2.0").
                  Package "@angular/compiler-cli" has an incompatible peer dependency to "typescript" (requires ">=2.7.2 <2.8", would install "2.6.2")
Incompatible peer dependencies found. See above.

I am not sure how to handle this & I don't want to try things on my own to avoid breaking the app.

Can someone please advise what to do?

My current dependencies are as follows:

{
 ....
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "^5.2.10",
    "@angular/cdk": "^5.2.5",
    "@angular/common": "^5.2.10",
    "@angular/compiler": "^5.2.10",
    "@angular/core": "^5.2.10",
    "@angular/flex-layout": "^5.0.0-beta.14",
    "@angular/forms": "^5.2.10",
    "@angular/http": "^5.2.10",
    "@angular/material": "^5.2.5",
    "@angular/platform-browser": "^5.2.10",
    "@angular/platform-browser-dynamic": "^5.2.10",
    "@angular/router": "^5.2.10",
    "@ngx-translate/core": "^9.1.1",
    "@ngx-translate/http-loader": "^3.0.1",
    "core-js": "^2.5.5",
    "hammerjs": "^2.0.8",
    "primeng": "^5.2.4",
    "rxjs": "^5.5.11",
    "zone.js": "^0.8.26"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.6.3",
    "@angular/cli": "^6.0.3",
    "@angular/compiler-cli": "^5.2.11",
    "@angular/language-service": "^5.2.10",
    "@types/jasmine": "~2.8.3",
    "@types/jasminewd2": "~2.0.2",
    "@types/node": "^6.0.106",
    "codelyzer": "^4.3.0",
    "jasmine-core": "~2.8.0",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "^2.0.2",
    "karma-chrome-launcher": "~2.2.0",
    "karma-coverage-istanbul-reporter": "^1.2.1",
    "karma-jasmine": "~1.1.0",
    "karma-jasmine-html-reporter": "^0.2.2",
    "protractor": "^5.3.2",
    "ts-node": "~4.1.0",
    "tslint": "~5.9.1",
    "typescript": "~2.6.2"
  }
}

`"typescript" : "^2.7.2"` and update your `@angular/flex-layout` to the latest version. after that run `npm install`. — Nour, May 24 '18 at 11:35
That means the `@angular/flex-layout` is not compatible with `rxjs 6` you should choose one of them :). — Nour, May 24 '18 at 11:43
Thanks Nour :) , I hope maybe someone can suggest some solution to use both — Ahmed Elkoussy, May 24 '18 at 11:45
Did you update your rxjs to the latest version ? i see you are not. so try to update it using the same guide you provide. `npm install -g rxjs-tslint` and `rxjs-5-to-6-migrate -p src/tsconfig.app.json` — Nour, May 24 '18 at 11:49
Thanks Nour, the 2 commands you mentioned should be done after updating the rxjs as far as I know, now I updated some dependencies with npm & it worked , thank you — Ahmed Elkoussy, May 24 '18 at 12:18

score 57 · Answer 1 · answered Jun 07 '18 at 10:09

57

A work around for this would be to add a --force flag.

ng update @angular/core --force

answered Jun 07 '18 at 10:09

Ikhlak S.

8,578
10
57
77

11

However using `force` is usually not recommended – Ahmed Elkoussy Jun 20 '18 at 19:29
2

Agree with @AhmedElkoussy. Wouldn’t `force` leave out peer dependencies? – jkim Jan 01 '21 at 19:33

score 32 · Accepted Answer · answered May 24 '18 at 12:17

Hope this will help someone else, I finally could solve the issue by manually updating some of the angular packages (using npm)

npm i @angular/cdk@6 @angular/compiler-cli@6 @angular/material@6 rxjs@6 --save

After that the ng update command could work (with some warnings, but at least we passed the ng update @angular/core)

ng update @angular/core
    Updating package.json with dependency @angular/language-service @ "6.0.3" (was "5.2.10")...
    Updating package.json with dependency @angular/animations @ "6.0.3" (was "5.2.10")...
    Updating package.json with dependency @angular/forms @ "6.0.3" (was "5.2.10")...
    Updating package.json with dependency @angular/common @ "6.0.3" (was "5.2.10")...
    Updating package.json with dependency @angular/compiler @ "6.0.3" (was "5.2.10")...
    Updating package.json with dependency @angular/core @ "6.0.3" (was "5.2.10")...
    Updating package.json with dependency @angular/router @ "6.0.3" (was "5.2.10")...
    Updating package.json with dependency @angular/platform-browser-dynamic @ "6.0.3" (was "5.2.10")...
    Updating package.json with dependency @angular/platform-browser @ "6.0.3" (was "5.2.10")...
    Updating package.json with dependency @angular/http @ "6.0.3" (was "5.2.10")...
UPDATE package.json (1587 bytes)
npm WARN @angular/compiler-cli@6.0.3 requires a peer of typescript@>=2.7.2 <2.8 but none is installed. You must install peer dependencies yourself.
npm WARN @angular/flex-layout@5.0.0-beta.14 requires a peer of @angular/cdk@^5.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN @angular/flex-layout@5.0.0-beta.14 requires a peer of @angular/core@^5.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN @angular/flex-layout@5.0.0-beta.14 requires a peer of @angular/common@^5.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN @angular/flex-layout@5.0.0-beta.14 requires a peer of rxjs@^5.5.0 but none is installed. You must install peer dependencies yourself.
npm WARN @ngtools/webpack@6.0.3 requires a peer of typescript@~2.4.0 || ~2.5.0 || ~2.6.0 || ~2.7.0 but none is installed. You must install peer dependencies yourself.
npm WARN @ngx-translate/http-loader@3.0.1 requires a peer of @ngx-translate/core@>=10.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN tsickle@0.27.5 requires a peer of typescript@>=2.4.2 <2.8 but none is installed. You must install peer dependencies yourself.

updated 10 packages in 57.253s

ng update @angular/core@6 if targetting for v6 based on your other commands — skjagini, Jul 23 '19 at 15:17

score 16 · Answer 3 · edited Feb 19 '21 at 16:47

16

The issue was solved for me after making a forced update like the following:-

ng update --all --force

It basically avoids/ignores all the dependency-checks and updates all the packages wherever applicable. Although it is not recommended generally, I had to do the update this way as other suggestions seemed to be not working for me.

edited Feb 19 '21 at 16:47

Amirhossein Mehrvarzi

18,024
7
45
70

answered Oct 11 '18 at 20:53

Sen

1,308
12
12

5

not recommend this, mad a lot of problems with me, prefer update every package alone – Muhammed Moussa Jul 25 '19 at 10:01
Caused loads of issues for me too – Ben Taliadoros Sep 11 '19 at 14:36

score 4 · Answer 4 · answered Jul 25 '18 at 19:57

4

I was able to get around messages about incompatible peers by using:

ng update --all

It updated all the packages that needed to be updated.

answered Jul 25 '18 at 19:57

lilabnersgal

198
1
4
8

will it update based on angular current version? or the latest version? I am behind ng versions, so currently I am non ng 7 moving to ng 11. will ng update --all update based on ng 7 or ng 11? – Janatbek Orozaly May 26 '21 at 19:27

score 2 · Answer 5 · answered Jan 18 '21 at 02:29

2

Running --force is not the right option. since it is complaining about rxjs and typescript, you need to upgrade that first. Once that's complete, you can run the angular update command

answered Jan 18 '21 at 02:29

Prashanth Madakatte

41
5

score 0 · Answer 6 · answered Apr 08 '20 at 09:07

0

Don't force update, that will later present unexpected results. Use the following npm install instead and try again.

npm install -g @angular-devkit/schematics-cli

answered Apr 08 '20 at 09:07

Dejazmach

742
8
15

score 0 · Answer 7 · answered Jul 23 '20 at 15:39

0

You can try:

npm i --save-dev @angular/cli@version @angular/core@version

Then you can run ng update --all This worked for me.

I got Incompatible peer dependencies found. See above. while updating @angular/cli and @angular/core using ng update --all.

answered Jul 23 '20 at 15:39

Dame Lyngdoh

312
4
18

score 0 · Answer 8 · edited Sep 15 '20 at 12:22

0

this command worked in my case :

npm install --force @angular/cli@version @angular/core@version

here version could be 6,7,8,9,10 on which you to upgrade

edited Sep 15 '20 at 12:22

Matthew Bakaitis

11,600
7
43
53

answered Sep 15 '20 at 12:05

shivani

1
1
5

When upgrading Angular 5 to 6, I get incompatible peer dependency (using ng update @angular/core)

8 Answers8