react-native-reanimated编译报错：NativeProxyCommon与DevMenuUtils相关错误

问题场景 #

删除node_modules和yarn.lock文件后，执行npx react-native run-android运行React Native项目时，react-native-reanimated模块构建失败，具体表现为:react-native-reanimated:compileDebugJavaWithJavac任务执行失败，编译报错信息如下：

D:\Projects\To Delete\NovacomApp V1.2.0.2\NovacomApp V1.2.0.2\node_modules\react-native-reanimated\android\src\reactNativeVersionPatch\ReactHost\72\com\swmansion\reanimated\DevMenuUtils.java:5: error: cannot find symbol
private void addDevMenuOption(ReactApplicationContext context, DevOptionHandler handler) {
^
symbol:   class ReactApplicationContext
location: class DevMenuUtils
D:\Projects\To Delete\NovacomApp V1.2.0.2\NovacomApp V1.2.0.2\node_modules\react-native-reanimated\android\src\reactNativeVersionPatch\ReactHost\72\com\swmansion\reanimated\DevMenuUtils.java:5: error: cannot find symbol
private void addDevMenuOption(ReactApplicationContext context, DevOptionHandler handler) {
^
symbol:   class DevOptionHandler
location: class DevMenuUtils
D:\Projects\To Delete\NovacomApp V1.2.0.2\NovacomApp V1.2.0.2\node_modules\react-native-reanimated\android\src\main\java\com\swmansion\reanimated\nativeProxy\NativeProxyCommon.java:85: error: addDevMenuOption(ReactApplicationContext,DevOptionHandler) has private access in DevMenuUtils
DevMenuUtils.addDevMenuOption(mContext.get(), this::toggleSlowAnimations);
^
D:\Projects\To Delete\NovacomApp V1.2.0.2\NovacomApp V1.2.0.2\node_modules\react-native-reanimated\android\src\reactNativeVersionPatch\ReactHost\72\com\swmansion\reanimated\DevMenuUtils.java:7: error: cannot find symbol
if (context.getApplicationContext() instanceof ReactApplication) {
^
symbol:   class ReactApplication
location: class DevMenuUtils
D:\Projects\To Delete\NovacomApp V1.2.0.2\NovacomApp V1.2.0.2\node_modules\react-native-reanimated\android\src\reactNativeVersionPatch\ReactHost\72\com\swmansion\reanimated\DevMenuUtils.java:8: error: cannot find symbol
final DevSupportManager devSupportManager =
^
symbol:   class DevSupportManager
location: class DevMenuUtils
D:\Projects\To Delete\NovacomApp V1.2.0.2\NovacomApp V1.2.0.2\node_modules\react-native-reanimated\android\src\reactNativeVersionPatch\ReactHost\72\com\swmansion\reanimated\DevMenuUtils.java:9: error: cannot find symbol
((ReactApplication) context.getApplicationContext())
^
symbol:   class ReactApplication
location: class DevMenuUtils
Note: Some input files use or override a deprecated API.
Note: Recompile with -Xlint:deprecation for details.
Note: Some input files use unchecked or unsafe operations.
Note: Recompile with -Xlint:unchecked for details.
6 errors

FAILURE: Build failed with an exception.

• What went wrong:
  Execution failed for task ':react-native-reanimated:compileDebugJavaWithJavac'.

Compilation failed; see the compiler error output for details.

项目环境信息 #

• 依赖版本：
  • react-native: 0.72.0
  • react-native-reanimated: ^3.12.0
• Babel配置：

module.exports = function (api) {
  api.cache(true);
  return {
    presets: ['module:metro-react-native-babel-preset'],
    plugins: [
      'react-native-reanimated/plugin',
    ],
  };
};

解决方案 #

1. 降级Reanimated到兼容版本 #

RN 0.72.0与Reanimated 3.12.0存在兼容性问题，需降级到经过验证兼容RN 0.72.x的版本：

• 执行命令锁定版本：

yarn add react-native-reanimated@3.10.0 --exact

• 删除node_modules和yarn.lock，重新执行yarn install

2. 清理Android构建缓存 #

清理Gradle缓存，避免旧编译残留影响构建：

cd android
./gradlew clean
cd ..

3. 确认Reanimated Babel插件顺序 #

确保react-native-reanimated/plugin在Babel配置的插件数组中处于最后一位（原配置已符合，可再次确认）：

module.exports = function (api) {
  api.cache(true);
  return {
    presets: ['module:metro-react-native-babel-preset'],
    plugins: [
      // 其他插件需放在reanimated插件之前
      'react-native-reanimated/plugin',
    ],
  };
};

4. 重新构建运行项目 #

执行命令重新启动项目：

npx react-native run-android

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