React Native中Cannot read property 'makeMutable' of undefined报错求助

修复步骤 #

• 调整Babel插件顺序
  Reanimated的Babel插件必须放在所有插件的最前面，确保你的配置格式正确：

  module.exports = {
    presets: ['module:@react-native/babel-preset'],
    plugins: [
      'react-native-reanimated/plugin',
      // 其他插件统一放在此插件之后
    ],
  };
  

• 彻底清除缓存并重建项目
  执行以下命令清除所有缓存后重新构建：

  # 重置Metro缓存
  npx react-native start --reset-cache
  # 清理Android构建缓存
  cd android && ./gradlew clean && cd ..
  # 重新运行Android项目
  npx react-native run-android
  

• 提前初始化Reanimated
  在项目入口文件（如index.js或App.js）的最顶部导入Reanimated，确保它是第一个被加载的依赖：

  import 'react-native-reanimated';
  // 其他所有导入语句放在此之后
  import React from 'react';
  import { View } from 'react-native';
  

• 重新安装依赖
  移除现有依赖文件后重新安装，确保版本匹配：

  rm -rf node_modules package-lock.json yarn.lock
  npm install
  

• 验证Android原生配置
  检查android/app/build.gradle是否已正确引入Reanimated依赖，同时确认MainApplication.java中包含Reanimated包的注册：

  import com.swmansion.reanimated.ReanimatedPackage;
  
  @Override
  protected List<ReactPackage> getPackages() {
    List<ReactPackage> packages = new PackageList(this).getPackages();
    packages.add(new ReanimatedPackage());
    return packages;
  }
  

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