CODEWITHSUNDEEP
node.jsangularnpmangular-cli
HelloWorld
HelloWorld

Reputation: 1863

Upgrade from Angular 11 to 12 causes peer dependency conflict

I'm currently upgrading from Angular 11.2.14 to Angular 12.0.5 and I run into the following issue:

npm ERR! Could not resolve dependency:
npm ERR! dev @angular-devkit/build-angular@"12.0.5" from the root project
npm ERR!
npm ERR! Conflicting peer dependency: @angular/[email protected]
npm ERR! node_modules/@angular/compiler-cli
npm ERR!   dev @angular/compiler-cli@"12.0.5" from the root project
npm ERR!   peer @angular/compiler-cli@"^12.0.0" from @angular-devkit/[email protected]
npm ERR!   node_modules/@angular-devkit/build-angular
npm ERR!     dev @angular-devkit/build-angular@"12.0.5" from the root project
npm ERR!   2 more (@angular/localize, ng-packagr)
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.

Am I right assuming this is because there is a conflict between the version 12.0.5 and 12.0.0 and they are incompatible? All my dependencies have now the same version, why is there a conflict present?

package.json

    "@angular-builders/custom-webpack": "12.1.0",
    "@angular-devkit/build-angular": "12.0.5",
    "@angular/animations": "12.0.5",
    "@angular/cdk": "12.0.5",
    "@angular/cli": "12.0.5",
    "@angular/common": "12.0.5",
    "@angular/compiler": "12.0.5",
    "@angular/compiler-cli": "12.0.5",
    "@angular/core": "12.0.5",
    "@angular/flex-layout": "11.0.0-beta.33",
    "@angular/forms": "12.0.5",
    "@angular/language-service": "12.0.5",
    "@angular/material": "11.2.13",
    "@angular/platform-browser": "12.0.5",
    "@angular/platform-browser-dynamic": "12.0.5",
    "@angular/router": "12.0.5",

Thanks a lot!

Upvotes: 14

Views: 13284

Answers (5)

Farhan Ahmad
Farhan Ahmad

Reputation: 31

Downgrad npm v6, I tried bunch of commands after googling get successful now

npm -g i npm@^6
npm i
ng update @angular/cli@^12 @angular/core@^12

Upvotes: 3

rc21
rc21

Reputation: 1872

I had got same error on every version angular update when i used official update guide https://update.angular.io/ and command npx @angular/cli@12 update @angular/core@12 @angular/cli@12. After long googling and trying i found next way for angular and angular material update (example for 10 to 11 update):

npx @angular/cli@11 update @angular/core@11 @angular/cli@11

getting subj error

remove node_modules and package-lock.json

npm install

Git commit

ng update @angular/core@11 --migrate-only --from 10 --to 11

Git commit

ng update @angular/cli@11 --migrate-only --from 10 --to 11

Git commit

npx @angular/cli@11 update @angular/material@11 @angular/[email protected]

Upvotes: 6

Juan
Juan

Reputation: 1

Update your tsconfig.json and then run

sudo npm install --force

Upvotes: -1

Papa Mufflon
Papa Mufflon

Reputation: 20010

I had to use npm v6 to make a successful update:

npm -g i npm@^6
npm i
ng update @angular/cli@^12 @angular/core@^12

Upvotes: 24

Andrew
Andrew

Reputation: 2939

I had this same issue which was confusing as a beginner

I initially tried this command, but I just got another error

ng update @angular/cli @angular/core

I then found this link https://github.com/angular/angular-cli/issues/20843 and one person said to do this global cli command, this seemed to have fixed the issue when creating a new project

npm i @angular/cli -g

I can now create my new project command e.g.:

ng new example --routing false --style css --skip-git --skip-tests

enter image description here

Upvotes: 0

Related Questions