twobin / react-lazyload

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

support for react@18.2.0 #400

Open AliSaberi opened 1 year ago

AliSaberi commented 1 year ago

It seems that the library does not support the react version 18.2.0

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

jeromelachaud commented 1 year ago

Same with react@18.0.0


npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: [REDACTED]@0.1.0
npm ERR! Found: react@18.0.0
npm ERR! node_modules/react
npm ERR!   react@"18.0.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@"3.2.0" from the root project
peZhmanParsaee commented 1 year ago

I can see in the package.json file of this repository it supports React v18.x.x : https://github.com/twobin/react-lazyload/blob/f1faffda816180f39d3ff8cf3d9c2060f8d9d623/package.json#L61

But it seems that changes have not been published to the npm registry yet. Because until now the that I write this comment, the npm registry of this repo was updated 2 years ago the last time. https://www.npmjs.com/package/react-lazyload

KonkretneKosteczki commented 1 year ago

I know it does not actually solve the underlying issue but as a workaround adding custom type resolution to your package.json seems to get rid of the error.

for yarn

  "resolutions": {
    "@types/react": "^18.0.25"
  },

and for npm

  "overrides": {
    "@types/react": "^18.0.25"
  },
jeromelachaud commented 1 year ago

I do already have "@types/react": "^18.0.25", entry as a devDependency.

jeromelachaud commented 1 year ago

ho, did you mean?:

"overrides": {
    "react-lazyload": {
      "@types/react": "^18.0.25"
    }
  }

Still got the error any way

peZhmanParsaee commented 1 year ago

@KonkretneKosteczki Thank you for this great tip.

@jeromelachaud The below change made the error to be gone:

"overrides": {
    "react-lazyload": {
      "react": "^18.2.0",
      "react-dom": "^18.2.0"
    }
  }

Actually react and react-dom should be set not @types/react

jeromelachaud commented 1 year ago

Awesome 🔥 Thanks @peZhmanParsaee @KonkretneKosteczki!

ikarus-pritish commented 1 year ago

@ameerthehacker Would it be possible to make a release to npm with this? Its been a hassle.

AakashRao-dev commented 1 year ago

Thanks @peZhmanParsaee 💪