Description
I’m encountering a compatibility issue when using @reactvision/[email protected] in a React Native 0.79.1 project with React 19.0.0.
When navigating to a screen that uses @reactvision/react-viro, I get the following runtime error:
Error: A React element from an older version of React was rendered. This is not supported. It could happen if multiple copies of React are loaded, or if a library pre-bundled an old copy of React or react/jsx-runtime.
Upon inspecting node_modules, I noticed:
• The main app is using [email protected] and [email protected]
• However, @reactvision/react-viro internally installs its own [email protected] and expects [email protected].
This causes a conflict because React Native 0.79 and React 19 use different internal jsx-runtime implementations compared to React 18
Details
• @reactvision/react-viro version: 2.43.0
• React version: 19.0.0
• React Native version: 0.79.1
• Error: A React element from an older version of React was rendered
Suggested fix
• Move react and react-native from dependencies to peerDependencies in the package.json of @reactvision/react-viro.
• Specify a peer dependency range like:
"peerDependencies": { "react": ">=18.0.0", "react-native": ">=0.76.0" }
• Remove react and react-native from dependencies.
Aditional Context:
The error is currently blocking the usage of @reactvision/react-viro in any project using the latest React Native and React versions.
Thank you for your work on this project! 🙏 I’m happy to test a fix if needed.