Dependency issues on installation

[nikita-fuchs]

Issue type

I'm submitting a ...

• [X] bug report

Issue description

Current behavior: When running npm install I get the following:

npm install
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/animations
npm ERR!   @angular/animations@"^12.2.16" from the root project
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! peer @angular/animations@"~9.1.1" from @swimlane/[email protected]
npm ERR! node_modules/@swimlane/ngx-charts
npm ERR!   @swimlane/ngx-charts@"^14.0.0" 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.

Expected behavior: Everything would just install.

Steps to reproduce: Clone the repo, run npm install

Other information:

npm, node, OS, Browser

Angular CLI: 12.2.12
Node: 18.3.0 (Unsupported)
Package Manager: npm 8.11.0
OS: Mac Monterey 12.4 (Intel)

Angular, Nebular

    "@nebular/auth": "8.0.0",
    "@nebular/eva-icons": "8.0.0",
    "@nebular/security": "8.0.0",
    "@nebular/theme": "8.0.0",
    "nebular-icons": "1.1.0",

[yunnnyunnn]

Switching to node 14 solved the problem for me. I used nvm to switch from node 18 to node 14 without messing up the system version: nvm install 14 nvm use 14 then npm install succeeded.

[GhadaAJIMI]

Hi, I have almost the same error but I do have angular 14.2.10 I create a new project and wanted to and nebular but I got stopped by this error and I don't know what to do. Can you hep me please ?

[nikita-fuchs]

use the --force, Luke.

Those upper version limits were apparently set out of cautiousness, using a higher version doesn't harm anything. here are my packages with which everything works fine using --force.

"dependencies": {
    "@angular/animations": "14.0.6",
    "@angular/cdk": "^13.0.0",
    "@angular/common": "14.0.6",
    "@angular/compiler": "14.0.6",
    "@angular/core": "14.0.6",
    "@angular/forms": "14.0.6",
    "@angular/language-service": "14.0.6",
    "@angular/platform-browser": "14.0.6",
    "@angular/platform-browser-dynamic": "14.0.6",
    "@angular/router": "14.0.6",
    "@electron/remote": "2.0.8",
    "@nebular/eva-icons": "9.1.0-rc.2",
    "@nebular/theme": "9.1.0-rc.2",
    "@ng-icons/core": "22.4.0",
    "@ng-icons/jam-icons": "22.4.0",
    "bootstrap": "5.2.1",
    "eva-icons": "1.1.3",
    "ng-number-picker": "1.1.9",
    "ng2-smart-table": "1.7.2",
    "rxjs": "7.5.6",
    "tslib": "^2.4.0",
    "zone.js": "~0.11.6"
  }

on anther project, I'm even using it all with angular 15, like so:

"dependencies": {
    "@aeternity/aepp-sdk": "^12.1.3",
    "@aeternity/aeproject": "^4.2.0",
    "@akveo/ng2-completer": "^9.0.1",
    "@angular-devkit/core": "^15.0.0",
    "@angular/animations": "^15.0.0",
    "@angular/cdk": "15.0.0",
    "@angular/common": "^15.0.0",
    "@angular/compiler": "^15.0.0",
    "@angular/core": "^15.0.0",
    "@angular/forms": "^15.0.0",
    "@angular/google-maps": "^12.1.0",
    "@angular/material": "^15.0.0",
    "@angular/platform-browser": "^15.0.0",
    "@angular/platform-browser-dynamic": "^15.0.0",
    "@angular/router": "^15.0.0",
    "@asymmetrik/ngx-leaflet": "3.0.1",
    "@nebular/auth": "9.0.0",
    "@nebular/eva-icons": "9.0.0",
    "@nebular/security": "9.0.0",
    "@nebular/theme": "9.0.0",
    "@swimlane/ngx-charts": "^14.0.0",
    "angular2-chartjs": "0.4.1",
    "bootstrap": "4.3.1",
    "chart.js": "2.7.1",
    "ckeditor": "4.7.3",
    "core-js": "2.5.1",
    "echarts": "^4.0.2",
    "eva-icons": "^1.1.3",
    "intl": "1.2.5",
    "ionicons": "2.0.1",
    "leaflet": "1.2.0",
    "nebular-icons": "1.1.0",
    "ng2-ckeditor": "^1.2.9",
    "ng2-smart-table": "^1.6.0",
    "ngx-echarts": "^4.2.2",
    "normalize.css": "6.0.0",
    "pace-js": "1.0.2",
    "roboto-fontface": "0.8.0",
    "rxjs": "6.6.2",
    "rxjs-compat": "6.3.0",
    "socicon": "3.0.5",
    "style-loader": "^1.1.3",
    "tinymce": "4.5.7",
    "tslib": "^2.3.0",
    "typeface-exo": "0.0.22",
    "typescript": "^4.8.4",
    "zone.js": "~0.11.4"
  }

I don't remember though if there are not any other setup steps required, to be honest. I think there will be issues with SCSS files using ~ (tilde) on import. You can fix that by removing them, and adding

"stylePreprocessorOptions": {
              "includePaths": [
                "./node_modules"
              ]

to angular.json -> build -> options

[GhadaAJIMI]

Ok thx I will try that