Can't install with NPM, unable to resolve dependency tree

[coneforapine]

Environment

System:                                                                                                                                                                                                                
    OS: Windows 10 10.0.22000                                                                                                                                                                                          
    CPU: (12) x64 AMD Ryzen 5 3600 6-Core Processor                                                                                                                                                                    
    Memory: 3.65 GB / 15.93 GB                                                                                                                                                                                         
  Binaries:
    Node: 16.7.0 - C:\Program Files\nodejs\node.EXE
    Yarn: Not Found
    npm: 7.20.3 - C:\Program Files\nodejs\npm.CMD
    Watchman: Not Found
  SDKs:
    Android SDK:
      API Levels: 29, 30, 31
      Build Tools: 29.0.2, 30.0.2, 31.0.0
      System Images: android-29 | Google APIs Intel x86 Atom, android-29 | Google Play Intel x86 Atom
      Android NDK: Not Found
    Windows SDK: Not Found
  IDEs:
    Android Studio: Version     2020.3.0.0 AI-203.7717.56.2031.7621141
    Visual Studio: 16.10.31515.178 (Visual Studio Community 2019)
  Languages:
    Java: 1.8.0_302
  npmPackages:
    @react-native-community/cli: Not Found
    react: 17.0.1 => 17.0.1
    react-native: 0.64.1 => 0.64.1
    react-native-windows: Not Found
  npmGlobalPackages:
    *react-native*: Not Found

Description

I've tried to install this module with npm install @react-native-community/slider but got an ERESOLVE message below.

npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR! 
npm ERR! While resolving: app@0.9.0
npm ERR! Found: react@17.0.1
npm ERR! node_modules/react
npm ERR!   react@"17.0.1" from the root project
npm ERR!   peer react@"*" from @react-native-community/slider@4.1.9
npm ERR!   node_modules/@react-native-community/slider
npm ERR!     @react-native-community/slider@"*" from the root project
npm ERR!   1 more (react-native)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react@"17.0.2" from react-native-windows@0.66.1
npm ERR! node_modules/react-native-windows
npm ERR!   peer react-native-windows@"*" from @react-native-community/slider@4.1.9
npm ERR!   node_modules/@react-native-community/slider
npm ERR!     @react-native-community/slider@"*" 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.

I've also tried to install it with --force option but it crashes the app whenever I try to render a slider.

[BartoszKlonowski]

Hello @coneforapine,

I believe that this issue is caused by various npm/cli issues, which were already addressed by several PR, like npm/arborist#266.
Please check if you can reproduce this issue with other versions.

---

I've also tried to reproduce it with my environment, and it went just fine.
Please check the logs below:

PS C:\Dev\ReproProjects\SliderReproAppProject> yarn add -D @react-native-community/slider
yarn add v1.22.5
[1/4] Resolving packages...
[2/4] Fetching packages...
info fsevents@2.3.2: The platform "win32" is incompatible with this module.
info "fsevents@2.3.2" is an optional dependency and failed compatibility check. Excluding it from installation.
[3/4] Linking dependencies...
warning "@react-native-community/eslint-config > @typescript-eslint/eslint-plugin > tsutils@3.21.0" has unmet peer dependency "typescript@>=2.8.0 || >= 3.2.0-dev || >= 3.3.0-dev || >= 3.4.0-dev || >= 3.5.0-dev || >= 3.6.0-dev || >= 3.6.0-beta || >= 3.7.0-dev || >= 3.7.0-beta".
warning "react-native-codegen > jscodeshift@0.11.0" has unmet peer dependency "@babel/preset-env@^7.1.6".
[4/4] Building fresh packages...
success Saved lockfile.
success Saved 2 new dependencies.
info Direct dependencies
└─ @react-native-community/slider@4.1.9
info All dependencies
├─ @react-native-community/slider@4.1.9
└─ flow-bin@0.113.0
Done in 9.69s.
PS C:\Dev\ReproProjects\SliderReproAppProject> npx react-native info
info Fetching system and libraries information...
System:
    OS: Windows 10 10.0.19042
    CPU: (8) x64 Intel(R) Core(TM) i5-10210U CPU @ 1.60GHz
    Memory: 15.93 GB / 23.76 GB
  Binaries:
    Node: 14.17.3 - C:\Program Files\nodejs\node.EXE
    Yarn: 1.22.5 - C:\Program Files (x86)\Yarn\bin\yarn.CMD
    npm: 7.21.1 - C:\Program Files\nodejs\npm.CMD
    Watchman: Not Found
  SDKs:
    Android SDK:
      API Levels: 28, 29, 30
      Build Tools: 28.0.3, 29.0.2, 29.0.3, 30.0.2, 30.0.3
      System Images: android-29 | Intel x86 Atom_64, android-29 | Google APIs Intel x86 Atom, android-30 | Google APIs Intel x86 Atom
      Android NDK: Not Found
    Windows SDK:
      AllowDevelopmentWithoutDevLicense: Enabled
      AllowAllTrustedApps: Enabled
      Versions: 10.0.15063.0, 10.0.18362.0, 10.0.19041.0
  IDEs:
    Android Studio: Version  4.2.0.0 AI-202.7660.26.42.7486908
    Visual Studio: 16.11.31624.102 (Visual Studio Community 2019), 16.9.30914.41 (Visual Studio Community 2019)
  Languages:
    Java: 1.8.0_292 - C:\Program Files\OpenJDK\openjdk-8u292-b10\bin\javac.EXE
  npmPackages:
    @react-native-community/cli: ^5.0.1 => 5.0.1
    react: 17.0.2 => 17.0.2
    react-native: 0.65.1 => 0.65.1
    react-native-windows: 0.65.4 => 0.65.4
  npmGlobalPackages:
    *react-native*: Not Found

Just for sure I will keep this open, but please let me know if other versions (for me 7.21.1 works) solves your issue.

[coneforapine]

I've never actually thought about updating npm. It worked when I passed --legacy-peer-deps. I'll try to create a new project to check if a newer npm version fixes the issue.

[coneforapine]

Nope. Just updated to npm 8.1.0 and still got the same issue. I really don't know if it is npm's problem or a package-related issue.

[BartoszKlonowski]

Nope. Just updated to npm 8.1.0 and still got the same issue. I really don't know if it is npm's problem or a package-related issue.

@coneforapine Why won't you try with the version I used - 7.21.1?

[IFinesse]

I got the same issue on Mac, npm version - 7.19.1

[ekremay]

I got the same issue as well. Windows 10, npm version: 7.24.0, react-native version: 0.65.1
Edit: I tried to downgrade my npm with npm install -g npm@7.21.1 but still got the same issue.
Edit 2:

1. Update npm with npm install npm@latest -g
2. Install the package with npm install @react-native-community/slider --save --legacy-peer-deps
3. Done.
   It worked for me. I couldn't able to do regular installation without --legacy-peer-deps and npm update.

[BartoszKlonowski]

@ekremay I've tried to reproduce this issue using your setup:

• update npm to the latest - 8.1.0
• react-native to the 0.65.1
• install the Slider using npm

Everything went fine, so I'm attaching the logs from the terminal (please take a look at the environment info):

PS C:\Dev\ReproProjects\SliderReproAppProject> npm install npm@latest -g
removed 224 packages, changed 10 packages, and audited 39 packages in 26s

1 moderate severity vulnerability

To address all issues, run:
  npm audit fix

Run `npm audit` for details.
PS C:\Dev\ReproProjects\SliderReproAppProject> npm install @react-native-community/slider

added 2 packages, changed 73 packages, and audited 1083 packages in 47s
76 packages are looking for funding
  run `npm fund` for details

48 vulnerabilities (14 moderate, 34 high)

To address issues that do not require attention, run:
  npm audit fix

To address all issues (including breaking changes), run:
  npm audit fix --force

Run `npm audit` for details.
PS C:\Dev\ReproProjects\SliderReproAppProject> npx react-native info
info Fetching system and libraries information...
System:
    OS: Windows 10 10.0.19042
    CPU: (8) x64 Intel(R) Core(TM) i5-10210U CPU @ 1.60GHz
    Memory: 11.58 GB / 23.76 GB
  Binaries:
    Node: 14.17.3 - C:\Program Files\nodejs\node.EXE
    Yarn: 1.22.5 - C:\Program Files (x86)\Yarn\bin\yarn.CMD
    npm: 8.1.0 - C:\Program Files\nodejs\npm.CMD
    Watchman: Not Found
  SDKs:
    Android SDK:
      API Levels: 28, 29, 30
      Build Tools: 28.0.3, 29.0.2, 29.0.3, 30.0.2, 30.0.3
      System Images: android-29 | Intel x86 Atom_64, android-29 | Google APIs Intel x86 Atom, android-30 | Google APIs Intel x86 Atom
      Android NDK: Not Found
    Windows SDK:
      AllowDevelopmentWithoutDevLicense: Enabled
      AllowAllTrustedApps: Enabled
      Versions: 10.0.15063.0, 10.0.18362.0, 10.0.19041.0
  IDEs:
    Android Studio: Version  4.2.0.0 AI-202.7660.26.42.7486908
    Visual Studio: 16.11.31624.102 (Visual Studio Community 2019), 16.9.30914.41 (Visual Studio Community 2019)
  Languages:
    Java: 1.8.0_292 - C:\Program Files\OpenJDK\openjdk-8u292-b10\bin\javac.EXE
  npmPackages:
    @react-native-community/cli: ^5.0.1 => 5.0.1
    react: 17.0.2 => 17.0.2
    react-native: 0.65.1 => 0.65.1
    react-native-windows: 0.65.4 => 0.65.4
  npmGlobalPackages:
    *react-native*: Not Found

[ekremay]

@BartoszKlonowski Thanks a lot. As I mentioned before, now I can use the slider in my project with npm update and --legacy-peer-deps trick, but I couldn't load it normally, I was able to install it when I added --legacy-peer-deps. Could this part I added --legacy-peer-deps cause a problem in the long or short term? I don't know.

[BartoszKlonowski]

@ekremay Thanks for the fast response,
As you can see in the logs of mine - I did not use the --legacy-peer-deps switch. I'm able to install the package normally using npm at the latest version.
FYI @coneforapine

I will try to dig into that though, let's see what we can find.

---

One more thought:
I know this is sometimes a bit frustrating answer/advice, but do you have Yarn installed? Could you try to install this package using Yarn? I just wonder if this would make a difference in your case.

[ekremay]

@BartoszKlonowski I was able to install it without any errors using yarn.
I leave the environment information in case it may be useful.

System:
    OS: Windows 10 10.0.19042
    CPU: (8) x64 Intel(R) Core(TM) i7 CPU         870  @ 2.93GHz
    Memory: 1.14 GB / 8.96 GB
  Binaries:
    Node: 16.10.0 - C:\Program Files\nodejs\node.EXE
    Yarn: 1.22.17 - ~\AppData\Roaming\npm\yarn.CMD
    npm: 8.1.0 - C:\Program Files\nodejs\npm.CMD
    Watchman: Not Found
  SDKs:
    Android SDK:
      API Levels: 29, 30
      Build Tools: 29.0.2, 30.0.2, 30.0.3
      System Images: android-29 | Intel x86 Atom_64, android-29 | Google APIs Intel x86 Atom, android-29 | Google Play Intel x86 Atom, android-30 | Google APIs Intel x86 Atom
      Android NDK: Not Found
    Windows SDK:
      AllowAllTrustedApps: Disabled
  IDEs:
    Android Studio: Version     2020.3.0.0 AI-203.7717.56.2031.7678000
    Visual Studio: 15.9.28307.423 (Visual Studio Community 2017), 16.2.29123.88 (Visual Studio Community 2019)
  Languages:
    Java: 16.0.1 - C:\Program Files\Common Files\Oracle\Java\javapath\javac.EXE
  npmPackages:
    @react-native-community/cli: Not Found
    react: 17.0.2 => 17.0.2
    react-native: 0.65.1 => 0.65.1
    react-native-windows: Not Found
  npmGlobalPackages:
    *react-native*: Not Found

[coneforapine]

I can confirm that I was also able to install it normally with yarn.