添加Drawer Navigator时react-native-reanimated兼容性问题致App崩溃

在尝试为Stack Navigator中的某个屏幕添加Drawer Navigator后，应用出现崩溃。此前项目运行完全正常。

项目依赖 #

项目的package.json依赖配置如下：

"dependencies": {
    "@react-native-community/masked-view": "^0.1.11",
    "@react-navigation/drawer": "^6.6.15",
    "@react-navigation/native": "^6.1.17",
    "@react-navigation/stack": "^6.3.29",
    "axios": "^1.7.1",
    "react": "18.2.0",
    "react-native": "0.74.1",
    "react-native-gesture-handler": "^2.16.2",
    "react-native-reanimated": "~2.2.0",
    "react-native-safe-area-context": "^4.10.1",
    "react-native-screens": "^3.31.1",
    "react-native-vector-icons": "^10.1.0",
    "react-navigation": "^5.0.0",
    "uuid": "^9.0.1"
  }

问题代码 #

出现崩溃的导航相关代码如下：

const Drawer = createDrawerNavigator();

function DrawerRoutes() {
  return (        
    <Drawer.Navigator drawerContent={props => <DrawerContent {...props} />}>
          <Drawer.Screen name="Timeline" component={Timeline} />
      </Drawer.Navigator>
  );
}

const App = () => {
  return (
    <NavigationContainer>
      <DrawerRoutes/>
    </NavigationContainer>
  );
};

export default App;

堆栈跟踪信息 #

崩溃时Android端的堆栈日志：

05-28 17:07:34.700  6544  6544 E AndroidRuntime: java.lang.VerifyError: Verifier rejected class com.swmansion.reanimated.NodesManager: void com.swmansion.reanimated.NodesManager.stopUpdatingOnAnimationFrame() failed to verify: void com.swmansion.reanimated.NodesManager.stopUpdatingOnAnimationFrame(): [0xF] register v2 has type Reference: com.facebook.react.uimanager.GuardedFrameCallback but expected Reference: com.facebook.react.modules.core.ChoreographerCompat$FrameCallback
05-28 17:07:34.700  6544  6544 E AndroidRuntime:  void com.swmansion.reanimated.NodesManager.startUpdatingOnAnimationFrame() failed to verify: void com.swmansion.reanimated.NodesManager.startUpdatingOnAnimationFrame(): [0xF] register v2 has type Reference: com.facebook.react.uimanager.GuardedFrameCallback but expected Reference: com.facebook.react.modules.core.ChoreographerCompat$FrameCallback (declaration of 'com.swmansion.reanimated.NodesManager' appears in /data/app/~~n7aHWts6rG05SiRh9ibVoA==/com.package-QS5dDN64Sts_kg6K_75KZg==/base.apk!classes2.dex)
05-28 17:07:34.700  6544  6544 E AndroidRuntime:    at com.swmansion.reanimated.ReanimatedModule.getNodesManager(ReanimatedModule.java:100)
05-28 17:07:34.700  6544  6544 E AndroidRuntime:    at com.swmansion.reanimated.ReanimatedModule$1.execute(ReanimatedModule.java:85)
05-28 17:07:34.700  6544  6544 E AndroidRuntime:    at com.facebook.react.uimanager.UIViewOperationQueue$UIBlockOperation.execute(UIViewOperationQueue.java:557)
05-28 17:07:34.700  6544  6544 E AndroidRuntime:    at com.facebook.react.uimanager.UIViewOperationQueue$1.run(UIViewOperationQueue.java:910)
05-28 17:07:34.700  6544  6544 E AndroidRuntime:    at com.facebook.react.uimanager.UIViewOperationQueue.flushPendingBatches(UIViewOperationQueue.java:1023)
05-28 17:07:34.700  6544  6544 E AndroidRuntime:    at com.facebook.react.uimanager.UIViewOperationQueue.-$$Nest$mflushPendingBatches(Unknown Source:0)
05-28 17:07:34.700  6544  6544 E AndroidRuntime:    at com.facebook.react.uimanager.UIViewOperationQueue$DispatchUIFrameCallback.doFrameGuarded(UIViewOperationQueue.java:1083)
05-28 17:07:34.700  6544  6544 E AndroidRuntime:    at com.facebook.react.uimanager.GuardedFrameCallback.doFrame(GuardedFrameCallback.java:29)
05-28 17:07:34.700  6544  6544 E AndroidRuntime:    at com.facebook.react.modules.core.ReactChoreographer$1.doFrame(ReactChoreographer.java:89)
05-28 17:07:34.700  6544  6544 E AndroidRuntime:    at android.view.Choreographer$CallbackRecord.run(Choreographer.java:1337)
05-28 17:07:34.700  6544  6544 E AndroidRuntime:    at android.view.Choreographer$CallbackRecord.run(Choreographer.java:1348)
05-28 17:07:34.700  6544  6544 E AndroidRuntime:    at android.view.Choreographer.doCallbacks(Choreographer.java:952)
05-28 17:07:34.700  6544  6544 E AndroidRuntime:    at android.view.Choreographer.doFrame(Choreographer.java:878)
05-28 17:07:34.700  6544  6544 E AndroidRuntime:    at android.view.Choreographer$FrameDisplayEventReceiver.run(Choreographer.java:1322)
05-28 17:07:34.700  6544  6544 E AndroidRuntime:    at android.os.Handler.handleCallback(Handler.java:958)
05-28 17:07:34.700  6544  6544 E AndroidRuntime:    at android.os.Handler.dispatchMessage(Handler.java:99)
05-28 17:07:34.700  6544  6544 E AndroidRuntime:    at android.os.Looper.loopOnce(Looper.java:205)
05-28 17:07:34.700  6544  6544 E AndroidRuntime:    at android.os.Looper.loop(Looper.java:294)
05-28 17:07:34.700  6544  6544 E AndroidRuntime:    at android.app.ActivityThread.main(ActivityThread.java:8177)
05-28 17:07:34.700  6544  6544 E AndroidRuntime:    at java.lang.reflect.Method.invoke(Native Method)
05-28 17:07:34.700  6544  6544 E AndroidRuntime:    at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:552)
05-28 17:07:34.700  6544  6544 E AndroidRuntime:    at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:971)

已尝试的解决步骤 #

• 核对react-native与react-native-reanimated的版本兼容性
• 更换react-native-reanimated的多个版本测试，问题仍存在

内容的提问来源于stack exchange，提问作者vmp