Ad

Could Not Resolve Peer Dependency Between My Angular App And My Custom Angular Library

- 1 answer

I have created this Angular library that I now want to use in my other Angular apps, but I seem to have trouble with my peer dependencies. I have tried fiddling around in my App's package.json, but couldn't seem to remove any of my errors.

What I have tried (in that order) :

  • Removing node_modules
  • ng update
  • npm update
  • npm audit --fix
  • npm i
  • Recreating a new test app all together

Here are the errors :

npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: [email protected]
npm ERR! Found: @angular/[email protected]
npm ERR! node_modules/@angular/common
npm ERR!   @angular/[email protected]"~13.0.0" from the root project
npm ERR!   peer @angular/[email protected]"^13.0.0 || ^14.0.0-0" from @angular/[email protected]
npm ERR!   node_modules/@angular/cdk
npm ERR!     @angular/[email protected]"^13.2.0" from the root project
npm ERR!     peer @angular/[email protected]"^13.0.0" from @my-group/[email protected]
npm ERR!     node_modules/@my-group/angular-lib
npm ERR!       @my-group/[email protected]"*" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer @angular/[email protected]"^13.1.0" from @my-group/[email protected]
npm ERR! node_modules/@my-group/angular-lib
npm ERR!   @my-group/[email protected]"*" from the root project
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.

package.json (App)

{
  "name": "lib-test",
  "version": "0.0.0",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "watch": "ng build --watch --configuration development",
    "test": "ng test"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "~13.0.0",
    "@angular/cdk": "^13.2.2",
    "@angular/common": "~13.0.0",
    "@angular/compiler": "~13.0.0",
    "@angular/core": "~13.0.0",
    "@angular/forms": "~13.0.0",
    "@angular/material": "^13.2.2",
    "@angular/platform-browser": "~13.0.0",
    "@angular/platform-browser-dynamic": "~13.0.0",
    "@angular/router": "~13.0.0",
    "@cloud-republic/angular-lib": "^1.1.4",
    "rxjs": "~7.4.0",
    "tslib": "^2.3.0",
    "zone.js": "~0.11.4"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~13.0.3",
    "@angular/cli": "~13.0.3",
    "@angular/compiler-cli": "~13.0.0",
    "@types/jasmine": "~3.10.0",
    "@types/node": "^12.11.1",
    "jasmine-core": "~3.10.0",
    "karma": "~6.3.0",
    "karma-chrome-launcher": "~3.1.0",
    "karma-coverage": "~2.0.3",
    "karma-jasmine": "~4.0.0",
    "karma-jasmine-html-reporter": "~1.7.0",
    "typescript": "~4.4.3"
  }
}

package.json (Library)

{
  "name": "@my-group/angular-lib",
  "version": "1.0.6",
  "publishConfig": {
    "@my-group:registry": "https://gitlab.com/api/v4/projects/XXXXXX/packages/npm/"
  },
  "scripts": {
    "build-lib": "ng build lib-angular",
    "semantic-release": "semantic-release"
  },
  "peerDependencies": {
    "@angular/cdk": "^13.0.0",
    "@angular/common": "^13.1.0",
    "@angular/core": "^13.1.0",
    "@angular/material": "^13.2.0",
    "ngx-bootstrap": "^8.0.0",
    "rxjs": "~7.4.0"
  },
  "dependencies": {
    "tslib": "^2.3.0"
  },
  "devDependencies": {
    "@semantic-release/gitlab": "^7.0.4",
    "semantic-release": "^19.0.2"
  }
}

Thanks in advance

Ad

Answer

This is not the issue with peer dependencies. This is more to do with version conflict. I guess you are using npm >=7 that's why you are getting this error:-

As mentioned in the error log try the below command to fix the issue:-

npm install --legacy-peer-deps

The above solution will solve your problem. However, the main issue is with your library. In your library package you are saying use the below package:-

 "@angular/common": "^13.1.0"

However, in your application, you have installed the below version. "@angular/common": "~13.0.0". So your library package is greater than the one installed in the application. Either install the same version in your application or downgrade the version in your library.

In this way, npm install command will work without any issue.

Ad
source: stackoverflow.com
Ad