uber / react-vis

Data Visualization Components
https://uber.github.io/react-vis
MIT License
8.73k stars 834 forks source link

React 18 support #1485

Open jkytomak opened 11 months ago

jkytomak commented 11 months ago

When trying to update to React 18 I get this kind of errors of all react-vis components:

error TS2786: 'FlexibleWidthXYPlot' cannot be used as a JSX component.
  Its type 'typeof FlexibleWidthXYPlot' is not a valid JSX element type.

Note: React-vis with React 17 works with fine even with newest ("17.0.80") "@types/react", if you don't get different versions of React by some other dependency. We needed to add this manual (yarn) resolve:

  "resolutions": {
    "@types/react": "17.0.80"
  }
collink commented 9 months ago

I'm not even able to install react-vis in a fresh React 18 project.

thisis-Shitanshu commented 9 months ago

@collink Are you encountering an error indicating a peer dependency version conflict? The package react-vis requires a React version from 15.0.0 to 16.x, which is incompatible with the React version 18.0.0 installed in your project.

image

To work around this, try running the command npm install react-vis@1.11.12 --legacy-peer-deps. The --legacy-peer-deps flag allows you to bypass peer dependency conflicts.

image

I suggest using react-vis@1.11.12 since the latest version has some issues with component rendering (#1482). I'll investigate this further. Meanwhile, this should help!

dancespiele commented 7 months ago

I have the same issue with RadialChart 'RadialChart' cannot be used as a JSX component. even with version 1.11.12 installed with yarn. Then sad but practically I have to find another alternative that at least works

jkytomak commented 1 month ago

First step would be merging this PR: https://github.com/uber/react-vis/pull/1473