twobin / react-lazyload

Lazy load your component, image or anything matters the performance.
MIT License
5.85k stars 487 forks source link

ERESOLVE unable to resolve dependency tree on nextjs and reactjs 18.2.0 #409

Open daenerys973 opened 1 year ago

daenerys973 commented 1 year ago

npm install --save react-lazyload npm ERR! code ERESOLVE npm ERR! ERESOLVE unable to resolve dependency tree npm ERR! npm ERR! While resolving: unplash-api@0.1.0 npm ERR! Found: react@18.2.0 npm ERR! node_modules/react npm ERR! react@"18.2.0" from the root project npm ERR! npm ERR! Could not resolve dependency: npm ERR! peer react@"^0.14.0 || ^15.0.0 || ^16.0.0 || ^17.0.0" from react-lazyload@3.2.0 npm ERR! node_modules/react-lazyload npm ERR! react-lazyload@"*" 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. npm ERR! npm ERR! npm ERR! For a full report see: npm ERR! C:\Users\user\AppData\Local\npm-cache_logs\2023-04-10T09_21_34_159Z-eresolve-report.txt

npm ERR! A complete log of this run can be found in: npm ERR! C:\Users\user\AppData\Local\npm-cache_logs\2023-04-10T09_21_34_159Z-debug-0.log

ruben-martin-lozano commented 1 year ago

https://github.com/twobin/react-lazyload/issues/380#issuecomment-1327797336

zxq08 commented 1 year ago

#380 (comment)

I get, but what gives me trouble is that npm package isn't updated yet

kyoungholee commented 3 months ago

This means that react-lazyload is defined to be compatible with earlier versions of react (0.14.0, 15.x, 16.x, 17.x).

To solve this problem, you can try the following methods:

  1. using the legacy-peer-defs option With this option, npm ignores incompatible peer dependencies and attempts to install them. This is one of the simplest solutions.

npm install --save react-lazyload --legacy-peer-deps

  1. --using the force option This option ignores any conflicts that occur during the installation process and forces the installation to proceed. However, this method should be used carefully as it can potentially result in broken dependencies.

npm install --save react-lazyload --force

  1. Use compatible libraries You can use another library that is compatible with React 18 instead of React-lazyload. For example, you can use libraries such as React-lazy-load-image-component or React-intersection-observor.

react-lazy-load-image-component

npm install --save react-lazy-load-image-component