search

smnbbrv / ngx-plyr

Angular 6+ binding for Plyr video & audio player
https://smnbbrv.github.io/ngx-plyr/
MIT License
100 stars 65 forks source link

Npm Install Error: #100

Open feeng10914017 opened 2 years ago

feeng10914017 commented 2 years ago

I try to Install, but get this error.
How can i do 

npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR! 
npm ERR! While resolving: video-system-angular@0.0.0
npm ERR! Found: tslib@2.4.0
npm ERR! node_modules/tslib
npm ERR!   tslib@"^2.1.0" from the root project
npm ERR!   tslib@"^2.3.0" from @angular/common@13.3.11
npm ERR!   node_modules/@angular/common
npm ERR!     @angular/common@"~13.3.11" from the root project
npm ERR!     peer @angular/common@">=8.0.0" from ngx-plyr@4.0.0
npm ERR!     node_modules/ngx-plyr
npm ERR!       ngx-plyr@"*" from the root project
npm ERR!   2 more (@angular/core, zone.js)
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! peer tslib@"^1.10.0" from ngx-plyr@4.0.0
npm ERR! node_modules/ngx-plyr
npm ERR!   ngx-plyr@"*" 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.
Angular CLI: 14.0.4
Node: 16.15.1
Package Manager: npm 8.13.2
OS: darwin x64

Angular: undefined
...

Package                      Version
------------------------------------------------------
@angular-devkit/architect    0.1400.4 (cli-only)
@angular-devkit/core         14.0.4 (cli-only)
@angular-devkit/schematics   14.0.4 (cli-only)
@schematics/angular          14.0.4 (cli-only)
  "dependencies": {
    "@angular/animations": "~13.3.11",
    "@angular/cdk": "^13.3.9",
    "@angular/common": "~13.3.11",
    "@angular/compiler": "~13.3.11",
    "@angular/core": "~13.3.11",
    "@angular/forms": "~13.3.11",
    "@angular/localize": "~13.3.11",
    "@angular/material": "^13.3.9",
    "@angular/platform-browser": "~13.3.11",
    "@angular/platform-browser-dynamic": "~13.3.11",
    "@angular/router": "~13.3.11",
    "@ng-bootstrap/ng-bootstrap": "^12.1.2",
    "@popperjs/core": "^2.10.2",
    "bootstrap": "^5.1.3",
    "flv.js": "^1.6.2",
    "ngx-bootstrap-icons": "^1.8.4",
    "ngx-plyr": "^4.0.0",
    "plyr": "^3.7.2",
    "prettier": "^2.7.1",
    "rxjs": "~6.6.0",
    "tslib": "^2.1.0",
    "zone.js": "~0.11.4"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~13.3.8",
    "@angular-eslint/builder": "13.5.0",
    "@angular-eslint/eslint-plugin": "13.5.0",
    "@angular-eslint/eslint-plugin-template": "13.5.0",
    "@angular-eslint/schematics": "13.5.0",
    "@angular-eslint/template-parser": "13.5.0",
    "@angular/cli": "~13.3.8",
    "@angular/compiler-cli": "~13.3.11",
    "@types/jasmine": "~3.6.0",
    "@types/node": "^12.11.1",
    "@typescript-eslint/eslint-plugin": "5.27.1",
    "@typescript-eslint/parser": "5.27.1",
    "eslint": "^8.17.0",
    "eslint-config-prettier": "^8.5.0",
    "jasmine-core": "~3.7.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.5.0",
    "typescript": "~4.6.4"
  }
metsehaf commented 2 years ago

@feeng10914017 , this is talking about peer dependency issue, basically the ngx-plyr version which is 4.0 that you have uses angular/common version 9 while your root project uses angular/common 13 hence the mismatch. I am not sure if the team will release an upgrade to support angular 13. You can run "npm i --legacy-peer-deps" which will by pass this mismatch and install the dependency anyway. I have angular 12 but it works with ngx-plyr version 3.6.9 "dependencies": { "@angular/animations": "~12.2.0", "@angular/cdk": "~12.2.8", "@angular/common": "~12.2.0", "@angular/compiler": "~12.2.0", "@angular/core": "~12.2.0", "@angular/forms": "~12.2.0", "@angular/material": "^12.2.8", "@angular/platform-browser": "~12.2.0", "@angular/platform-browser-dynamic": "~12.2.0", "@angular/router": "~12.2.0", "@angular/youtube-player": "^13.1.0", "@fortawesome/angular-fontawesome": "^0.9.0", "@fortawesome/fontawesome-svg-core": "^1.2.36", "@fortawesome/free-brands-svg-icons": "^5.15.4", "@fortawesome/free-solid-svg-icons": "^5.15.4", "angular-vimeo-api-factory": "^0.5.2", "ngx-plyr": "^4.0.0", "ngx-sharebuttons": "^8.0.5", "plyr": "^3.6.9", "rxjs": "~6.6.0", "tslib": "^2.3.0", "zone.js": "~0.11.4" }, "devDependencies": { "@angular-devkit/build-angular": "~12.2.6", "@angular/cli": "~12.2.6", "@angular/compiler-cli": "~12.2.0", "@types/jasmine": "~3.8.0", "@types/node": "^12.11.1", "jasmine-core": "~3.8.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.3.5" }