software-mansion/react-native-reanimated

New Bug: ReanimatedError: [Reanimated] Native part of Reanimated doesn't seem to be initialized.

faizan2301 opened this issue · 9 comments

Description

I've installed reanimated in the latest version of react native cli but it is giving error :
my react native version: 0.76.4 and reanimated version: 3.16.3
ReanimatedError: [Reanimated] Native part of Reanimated doesn't seem to be initialized.
Below are the configurations I've set up:

//babel.config.js
module.exports = {
 presets: ['module:@react-native/babel-preset', 'nativewind/babel'],
 plugins: ['react-native-reanimated/plugin'],
};

My dependencies:

"dependencies": {
    "@react-native-community/blur": "^4.4.1",
    "@react-navigation/bottom-tabs": "^7.1.3",
    "@react-navigation/drawer": "^7.0.19",
    "@react-navigation/elements": "^2.2.4",
    "@react-navigation/material-top-tabs": "^7.0.18",
    "@react-navigation/native": "^7.0.13",
    "@react-navigation/native-stack": "^7.1.14",
    "@reduxjs/toolkit": "^2.4.0",
    "lottie-react-native": "^7.1.0",
    "nativewind": "^4.1.23",
    "react": "18.3.1",
    "react-native": "0.76.4",
    "react-native-flash-message": "^0.4.2",
    "react-native-gesture-handler": "^2.21.2",
    "react-native-mmkv": "^3.1.0",
    "react-native-pager-view": "^6.6.1",
    "react-native-paper": "^5.12.5",
    "react-native-reanimated": "^3.16.3",
    "react-native-safe-area-context": "^5.0.0",
    "react-native-screens": "^4.3.0",
    "react-native-vector-icons": "^10.2.0",
    "react-redux": "^9.1.2",
    "tailwindcss": "^3.4.16"
  },
  "devDependencies": {
    "@babel/core": "^7.25.2",
    "@babel/preset-env": "^7.25.3",
    "@babel/runtime": "^7.25.0",
    "@react-native-community/cli": "15.0.1",
    "@react-native-community/cli-platform-android": "15.0.1",
    "@react-native-community/cli-platform-ios": "15.0.1",
    "@react-native/babel-preset": "0.76.4",
    "@react-native/eslint-config": "0.76.4",
    "@react-native/metro-config": "0.76.4",
    "@react-native/typescript-config": "0.76.4",
    "@types/react": "^18.2.6",
    "@types/react-native-vector-icons": "^6.4.18",
    "@types/react-test-renderer": "^18.0.0",
    "babel-jest": "^29.6.3",
    "eslint": "^8.19.0",
    "jest": "^29.6.3",
    "prettier": "2.8.8",
    "react-test-renderer": "18.3.1",
    "typescript": "5.0.4"
  },

Also I've tried to clear cache with this command:

yarn start --reset-cache

Steps to reproduce

  1. Create a React native Cli project using this command:
    npx @react-native-community/cli init ProjectName

  2. Setup the project according to reanimated docs.

  3. Write any code to use reanimated for ex:

import Animated from 'react-native-reanimated';
export default function App() {
  return (
    <Animated.View
      style={{
        width: 100,
        height: 100,
        backgroundColor: 'violet',
      }}
    />
  );
}
  1. You'll get the not initialize error

Snack or a link to a repository

https://github.com/faizan2301/ReanimatedIssue

Reanimated version

3.16.3

React Native version

0.76.4

Platforms

Android

JavaScript runtime

None

Workflow

React Native

Architecture

Fabric (New Architecture)

Build type

Debug app & dev bundle

Device

Real device

Device model

Realme 9

Acknowledgements

Yes

Can confirm, I am getting the same issue on the exact same versions.

Same issue on the Same Version but 0.76.3 is working fine.

same here:
"react-native-reanimated": "^3.16.3",
"react-native": "0.76.4",

I had upgraded both react-native-reanimated & react-native from 3.16.2 & 0.76.3 respectively.

react-native-reanimated@3.16.3 is working fine with react-native@0.76.3. But neither 3.16.2 nor 3.16.3 works with RN 0.76.4.

Got same issue

(NOBRIDGE) ERROR ReanimatedError: [Reanimated] Native part of Reanimated doesn't seem to be initialized.
See https://docs.swmansion.com/react-native-reanimated/docs/guides/troubleshooting#native-part-of-reanimated-doesnt-seem-to-be-initialized for more details. [Component Stack]
(NOBRIDGE) ERROR Warning: TypeError: Cannot read property 'makeMutable' of undefined

"react-native-reanimated": "^3.16.3",
"react": "18.3.1",
"react-native": "0.76.4",

module.exports = {

presets: ['module:@react-native/babel-preset'],
plugins: ['react-native-reanimated/plugin'],
};

Seems like the React Native Team have fixed the issue and are working to merge the revert in the linked PR:

facebook/react-native#48173 (comment)

UPDATE: Upgrading to RN 0.76.5 fixed linking issues on Android

Upgrading to RN 0.76.5 fixes this.

React Native team has launched latest version 0.76.5 in that version it is fixed.
npx @react-native-community/cli init ProjectName
If you want to start a new project with a specific React Native version, you can use the --version argument:
npx @react-native-community/cli@X.XX.X init AwesomeProject --version X.XX.X