react-native-reanimated: The native part of Reanimated doesn't seem to be initialized

I managed to fix it by running:

npx react-native-clean-project

And clearing all IOS files and Pods.

@nikolal

npx react-native-clean-project

Wow, many many thanks, I didn’t know this package but it works very very well. My app is now building

my stack :

"react-native": "0.72.4",
"react-native-reanimated": "^3.4.2",

This is fixed with the combo of RN 0.72.x and RNR 3.4.x So no need to modify any app delegate files.

And don’t forget to do pod install and also to start metro with --reset-cache to pick up the new version of the babel plugin

Go too your babel config. js file and add These to you code plugins : [ ‘react-native-reaanimated/plugins’] and go back too you Terminal and restart with these command line npm start – —reset–cache

SUCCESS!

It is most certainly Nx related. My knowledge of dependency loading is not the deepest so this is a bit of a guess, but Nx doesn’t seem pick up on peer dependencies of implicit dependencies (the ones it establishes by analyzing source code). The reason this was a problem was that Nx’s sync-deps step didn’t update the target’s package.json with the react-native-reanimated: "*" entry that would signal Nx React Native to scan the package and install the corresponding Pods if necessary. So I didn’t have a Reanimated Pod at all.

So if you use Nx and run into this, add

{
    "dependencies": {
        "react-native-reanimated": "*"
    }
}

to the package.json of your target. Then run the npx nx pod-install [target], and you should be good to go!

After installing the library, I ran expo run:ios and this fixed the error for me.

I’m also still seeing this issue. Have spent several hours troubleshooting and still getting this error. I’m using NX monorepo:

• react-native: 0.72.3
• react-native-reanimated: 3.4.2
• @react-navigation/native: 6.1.7
• @react-navigation/drawer: 6.6.3

Have run react-native-project-clean. Have manually cleaned. Have restarted computer. Have deleted node_modules and cleared npm cache. Have deleted pods and reinstalled. Have cleared watchman and metro cache. I’ve gone into xcworkspace and manually cleaned and rebuilt. I’ve reset all content and settings from my iOS simulator. This project is brand new, just generated using nx-create-workspace this morning. It has no other code in it except trying to create a drawer navigator.

I’ve peeked into AppDelegate.h and it’s already using RCTDelegate instead of UIResponder. Still can’t get past this error. Can someone reopen this issue?

Hey @nikolal

Sure, I cant say for sure what did it, but im pretty sure it was a combination of updating the AppDelegate.mm and AppDelegate.h files.
A year or so ago we ejected from an expo app and have somewhat been cleaning up bits and peices ever since.

I based my updates on this 0.72.1 diffApp: https://github.com/react-native-community/rn-diff-purge/tree/version/0.72.1/RnDiffApp

For starters, I noticed we had AppDelgate.m not .mm, not sure if that matters, but that’s what the latest template says it should be.

Our AppDelegate.h also had some different content, likely from a previous versions standard as I don tthink this is a commonly changed file.
I changed ours to match this: https://github.com/react-native-community/rn-diff-purge/blob/version/0.72.1/RnDiffApp/ios/RnDiffApp/AppDelegate.h

Our AppDelegate.mm cotent was also quite different, with a bunch of outdated Flipper setup lines in there, I removed all those as it’s part of framework by default now.

I based our new AppDelegate on this: https://github.com/react-native-community/rn-diff-purge/blob/version/0.72.1/RnDiffApp/ios/RnDiffApp/AppDelegate.mm

Our new AppDelegate.mm is close to this and now looks like

#import "AppDelegate.h"

#import <React/RCTBridge.h>
#import <React/RCTBundleURLProvider.h>
#import <React/RCTRootView.h>
#import <React/RCTLinkingManager.h>

#import "RNSplashScreen.h"

@interface AppDelegate () <RCTBridgeDelegate>
  @property (nonatomic, strong) NSDictionary *launchOptions;
@end

@implementation AppDelegate

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
  self.moduleName = @"main";
  // You can add your custom initial props in the dictionary below.
  // They will be passed down to the ViewController used by React Native.
  self.initialProps = @{};

  return [super application:application didFinishLaunchingWithOptions:launchOptions];
}

- (RCTBridge *)initializeReactNativeApp
{
  RCTBridge *bridge = [[RCTBridge alloc] initWithDelegate:self launchOptions:self.launchOptions];
  RCTRootView *rootView = [[RCTRootView alloc] initWithBridge:bridge moduleName:@"main" initialProperties:nil];
  rootView.backgroundColor = [[UIColor alloc] initWithRed:0.13 green:0.13 blue:0.13 alpha:1];// Change the background colour of the app starting up

  UIViewController *rootViewController = [UIViewController new];
  rootViewController.view = rootView;
  self.window.rootViewController = rootViewController;
  [self.window makeKeyAndVisible];
  
  // Set the splash screen to show by default.
  [RNSplashScreen show]; 

  return bridge;
 }

- (NSURL *)sourceURLForBridge:(RCTBridge *)bridge
{
#if DEBUG
  return [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index"];
#else
  return [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];
#endif
}

// Linking API
- (BOOL)application:(UIApplication *)application openURL:(NSURL *)url options:(NSDictionary<UIApplicationOpenURLOptionsKey,id> *)options {
  return [RCTLinkingManager application:application openURL:url options:options];
}

// Universal Links
- (BOOL)application:(UIApplication *)application continueUserActivity:(nonnull NSUserActivity *)userActivity restorationHandler:(nonnull void (^)(NSArray<id<UIUserActivityRestoring>> * _Nullable))restorationHandler {
  return [RCTLinkingManager application:application
                   continueUserActivity:userActivity
                     restorationHandler:restorationHandler];
}

@end

I didnt change anything in React land before it started working, so I think your problem will be around these files too…

Our index.js is stock standard

import { AppRegistry } from "react-native";
import App from "./App";
import {name as appName} from './app.json';

AppRegistry.registerComponent(appName, () => App);

Once this error cleared, I did have to wrap our app in a <GestureHandlerRootView style={{ flex: 1 }}> at the root level to clear a different error, although the docs on this on the software-mansion website were pretty clear,

I hope that helps.