[Fixed] Incompatible peer dependencies found – upgrading Angular from 8 to 9

Issue

I am following the official document to upgrade.

This step completed without any errors.

ng update @angular/[email protected] @angular/[email protected]

Next step failed.

ng update @angular/core @angular/cli
The installed Angular CLI version is older than the latest stable version.
Installing a temporary version to perform the update.
Installing packages for tooling via npm.
Installed packages for tooling via npm.
Using package manager: 'npm'
Collecting installed dependencies...
Found 45 dependencies.
Fetching dependency metadata from registry...
                  Package "@angular/core" has a missing peer dependency of "tslib" @ "^1.10.0".
                  Package "@angular/animations" has a missing peer dependency of "tslib" @ "^1.10.0".
                  Package "@angular/compiler" has a missing peer dependency of "tslib" @ "^1.10.0".
                  Package "@angular/forms" has a missing peer dependency of "tslib" @ "^1.10.0".
                  Package "@angular/common" has a missing peer dependency of "tslib" @ "^1.10.0".
                  Package "@angular/platform-browser" has a missing peer dependency of "tslib" @ "^1.10.0".
                  Package "@angular/compiler-cli" has a missing peer dependency of "tslib" @ "^1.10.0".
                  Package "@angular/router" has a missing peer dependency of "tslib" @ "^1.10.0".
                  Package "@angular/platform-browser-dynamic" has a missing peer dependency of "tslib" @ "^1.10.0".
                  Package "@ngtools/webpack" has an incompatible peer dependency to "typescript" (requires ">=3.4 < 3.6", would install "3.7.5").
Incompatible peer dependencies found.
Peer dependency warnings when installing dependencies means that those dependencies might not work correctly together.
You can use the '--force' option to ignore incompatible peer dependencies and instead address these warnings later.

I checked the node_modules and the correct version of tslib is installed.
I manually added the tslib entry and ran npm install to see if the error goes away.

  "dependencies": {
    "@angular/animations": "^8.2.14",
    "@angular/common": "^8.2.14",
    "@angular/compiler": "^8.2.14",
    "@angular/core": "^8.2.14",
    "@angular/forms": "^8.2.14",
    "@angular/language-service": "^8.2.14",
    "@angular/platform-browser": "^8.2.14",
    "@angular/platform-browser-dynamic": "^8.2.14",
    "@angular/router": "^8.2.14",
    "@ng-bootstrap/ng-bootstrap": "^5.3.0",
    "classlist.js": "^1.1.20150312",
    "core-js": "^3.6.4",
    "npm": "^6.13.7",
    "rxjs": "^6.5.4",
    "web-animations-js": "^2.3.2",
    "zone.js": "~0.9.1"
  },
  "devDependencies": {
    "@angular-devkit/architect": "^0.803.25",
    "@angular-devkit/build-angular": "^0.803.25",
    "@angular-devkit/build-optimizer": "^0.803.25",
    "@angular-devkit/build-webpack": "^0.803.25",
    "@angular-devkit/core": "^8.3.25",
    "@angular-devkit/schematics": "^8.3.25",
    "@angular/cli": "^8.3.25",
    "@angular/compiler-cli": "^8.2.14",
    "@ngtools/webpack": "^8.3.25",
    "@schematics/angular": "^8.3.25",
    "@schematics/update": "^0.803.25",
    "@types/jasmine": "^3.5.4",
    "@types/jasminewd2": "^2.0.8",
    "@types/node": "^12.12.27",
    "tslib": "^1.10.0",
    "codelyzer": "^5.2.1",
    "jasmine-core": "^3.5.0",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "^4.4.1",
    "karma-chrome-launcher": "~3.1.0",
    "karma-coverage-istanbul-reporter": "^2.1.1",
    "karma-jasmine": "~2.0.1",
    "karma-jasmine-html-reporter": "^1.5.2",
    "protractor": "^5.4.3",
    "rxjs-tslint": "^0.1.7",
    "ts-node": "^8.6.2",
    "tslint": "^5.20.1",
    "typescript": "~3.4",
    "webpack": "^4.41.6",
    "webpack-dev-server": "^3.10.3"
  }

ng v output

Angular CLI: 8.3.25
Node: 12.13.0
OS: win32 x64
Angular: 8.2.14
... animations, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.803.24
@angular-devkit/build-angular     0.803.25
@angular-devkit/build-optimizer   0.803.24
@angular-devkit/build-webpack     0.803.25
@angular-devkit/core              8.3.24
@angular-devkit/schematics        8.3.24
@angular/cli                      8.3.25
@ngtools/webpack                  8.3.24
@schematics/angular               8.3.24
@schematics/update                0.803.24
rxjs                              6.5.4
typescript                        3.4.5
webpack                           4.41.5

I haven’t tried to use –force option. Is there another way?

Solution

Looks like you glanced over one of the errors:

Package "@ngtools/webpack" has an incompatible peer dependency to "typescript" (requires ">=3.4 < 3.6", would install "3.7.5").

Try a lower version of @ngtools/webpack that works with TypeScript 3.4 to 3.5.

Alternatively, update your TypeScript version in the package.json to 3.7.5 and run npm update, then you should be able to update @angular/core & @angular/cli.

Leave a Reply

(*) Required, Your email will not be published