Dependency errors when trying to install Vite

This is the error I get when trying to install the vite react plugin:

npm WARN ERESOLVE overriding peer dependency
npm ERR! code ERESOLVE
npm ERR! ERESOLVE could not resolve
npm ERR! 
npm ERR! While resolving: @ionic-native/geolocation@5.36.0
npm ERR! Found: @ionic-native/core@4.20.0
npm ERR! node_modules/@ionic-native/core
npm ERR!   peer @ionic-native/core@"^4.11.0" from @ionic-native/app-version@4.20.0
npm ERR!   node_modules/@ionic-native/app-version
npm ERR!     @ionic-native/app-version@"^4.20.0" from the root project
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! peer @ionic-native/core@"^5.1.0" from @ionic-native/geolocation@5.36.0
npm ERR! node_modules/@ionic-native/geolocation
npm ERR!   @ionic-native/geolocation@"^5.36.0" from the root project
npm ERR! 
npm ERR! Conflicting peer dependency: @ionic-native/core@5.36.0
npm ERR! node_modules/@ionic-native/core
npm ERR!   peer @ionic-native/core@"^5.1.0" from @ionic-native/geolocation@5.36.0
npm ERR!   node_modules/@ionic-native/geolocation
npm ERR!     @ionic-native/geolocation@"^5.36.0" from the root project

I thought this meant that I should update to the latest ionic-native/core version so I tried:

sudo npm install @ionic-native/core@latest
I get this:

npm ERR! While resolving: @ionic-native/app-version@4.20.0
npm ERR! Found: @ionic-native/core@5.36.0
npm ERR! node_modules/@ionic-native/core
npm ERR!   @ionic-native/core@"5.36.0" from the root project
npm ERR!   peer @ionic-native/core@"^5.1.0" from @ionic-native/geolocation@5.36.0
npm ERR!   node_modules/@ionic-native/geolocation
npm ERR!     @ionic-native/geolocation@"^5.36.0" from the root project
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! peer @ionic-native/core@"^4.11.0" from @ionic-native/app-version@4.20.0
npm ERR! node_modules/@ionic-native/app-version
npm ERR!   @ionic-native/app-version@"^4.20.0" from the root project
npm ERR! 
npm ERR! Conflicting peer dependency: @ionic-native/core@4.20.0
npm ERR! node_modules/@ionic-native/core
npm ERR!   peer @ionic-native/core@"^4.11.0" from @ionic-native/app-version@4.20.0
npm ERR!   node_modules/@ionic-native/app-version
npm ERR!     @ionic-native/app-version@"^4.20.0" from the root project

Any idea on how I should get to the right version so I can move onto getting vite?

Also, this is my package.json if it helps. Interestingly I don’t see @ionic-native/core:

{
  "name": "myapp",
  "version": "0.0.1",
  "private": true,
  "dependencies": {
    "@awesome-cordova-plugins/app-version": "^5.44.0",
    "@awesome-cordova-plugins/core": "^5.44.0",
    "@capacitor/android": "^5.0.0",
    "@capacitor/app": "^5.0.0",
    "@capacitor/browser": "^5.0.0",
    "@capacitor/core": "^5.0.0",
    "@capacitor/geolocation": "^5.0.0",
    "@capacitor/haptics": "^5.0.0",
    "@capacitor/ios": "^5.0.0",
    "@capacitor/keyboard": "^5.0.0",
    "@capacitor/status-bar": "^5.0.0",
    "@ionic-native/app-version": "^4.20.0",
    "@ionic-native/geolocation": "^5.36.0",
    "@ionic/react": "^6.3.9",
    "@ionic/react-router": "^6.1.10",
    "@react-leaflet/core": "^1.0.2",
    "@testing-library/jest-dom": "^5.11.9",
    "@testing-library/react": "^11.2.5",
    "@testing-library/user-event": "^12.6.3",
    "@types/jest": "^26.0.20",
    "@types/node": "^12.19.15",
    "@types/react": "^16.14.3",
    "@types/react-dom": "^16.9.10",
    "@types/react-router": "^5.1.11",
    "@types/react-router-dom": "^5.1.7",
    "cordova-plugin-app-version": "^0.1.14",
    "cordova-plugin-geolocation": "^4.1.0",
    "dotenv": "^10.0.0",
    "ionicons": "^5.4.0",
    "leaflet": "^1.9.3",
    "mapbox-gl": "^2.3.0",
    "mime": "^2.5.2",
    "node-sass": "^6.0.0",
    "pullstate": "^1.22.1",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "react-leaflet": "^4.2.0",
    "react-map-gl": "^6.1.16",
    "react-router": "^5.2.0",
    "react-router-dom": "^5.2.0",
    "reselect": "^4.0.0",
    "swiper": "^6.8.4",
    "typescript": "^4.1.3",
    "web-vitals": "^0.2.4",
    "workbox-background-sync": "^5.1.4",
    "workbox-broadcast-update": "^5.1.4",
    "workbox-cacheable-response": "^5.1.4",
    "workbox-core": "^5.1.4",
    "workbox-expiration": "^5.1.4",
    "workbox-google-analytics": "^5.1.4",
    "workbox-navigation-preload": "^5.1.4",
    "workbox-precaching": "^5.1.4",
    "workbox-range-requests": "^5.1.4",
    "workbox-routing": "^5.1.4",
    "workbox-strategies": "^5.1.4",
    "workbox-streams": "^5.1.4"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test --transformIgnorePatterns 'node_modules/(?!(@ionic/react|@ionic/react-router|@ionic/core|@stencil/core|ionicons)/)'",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": [
      "react-app",
      "react-app/jest"
    ]
  },
  "browserslist": [
    ">0.2%",
    "not dead",
    "not op_mini all"
  ],
  "devDependencies": {
    "@capacitor/cli": "^5.0.0",
    "@types/leaflet": "^1.7.5",
    "react-scripts": "4.0.2"
  },
  "description": "An Ionic project"
}

@ionic-native is deprecated and was replaced with @awesome-cordova-plugins.

You should not use any @ionic-native anymore, but instead the @awesome-cordova-plugins equivalent.

And also, the versions of all the packages should match to prevent errors like yours where some package is older and expect an old version but you also have a newer package that expect a newer version and they fail to install because of that.

1 Like