React Native执行assembleRelease命令时出现资源重复错误

错误详情 #

执行assembleRelease命令打包Release版本时，:app:mergeReleaseResources任务执行失败，触发资源重复冲突，具体重复文件如下：

• [drawable-hdpi-v4/node_modules_reactnavigation_drawer_src_views_assets_toggledrawericon]：
  本地手动添加路径：D:\User\rms\FincApp\android\app\src\main\res\drawable-hdpi\node_modules_reactnavigation_drawer_src_views_assets_toggledrawericon.png
  打包自动生成路径：D:\User\rms\FincApp\android\app\build\generated\res\createBundleReleaseJsAndAssets\drawable-hdpi\node_modules_reactnavigation_drawer_src_views_assets_toggledrawericon.png
• [drawable-hdpi-v4/node_modules_reactnavigation_elements_src_assets_backicon]：
  本地手动添加路径：D:\User\rms\FincApp\android\app\src\main\res\drawable-hdpi\node_modules_reactnavigation_elements_src_assets_backicon.png
  打包自动生成路径：D:\User\rms\FincApp\android\app\build\generated\res\createBundleReleaseJsAndAssets\drawable-hdpi\node_modules_reactnavigation_elements_src_assets_backicon.png

解决方案 #

方法1：删除手动添加的重复资源 #

直接删除android/app/src/main/res/drawable-hdpi/目录下的以下两个文件：

• node_modules_reactnavigation_drawer_src_views_assets_toggledrawericon.png
• node_modules_reactnavigation_elements_src_assets_backicon.png
  打包过程中createBundleReleaseJsAndAssets任务会自动生成这些资源，手动添加的版本会导致冲突。

方法2：通过Gradle配置排除重复资源 #

在android/app/build.gradle的android代码块中添加打包排除规则，忽略手动添加的重复文件：

android {
    // 保留原有配置...
    packagingOptions {
        exclude 'drawable-hdpi/node_modules_reactnavigation_drawer_src_views_assets_toggledrawericon.png'
        exclude 'drawable-hdpi/node_modules_reactnavigation_elements_src_assets_backicon.png'
    }
}

方法3：清理构建缓存后重新打包 #

执行以下命令清理Android构建缓存，避免旧缓存导致的资源冲突：

# 进入Android目录清理缓存
cd android && ./gradlew clean
# 返回项目根目录执行打包
cd .. && ./gradlew assembleRelease

方法4：升级导航依赖版本 #

当前使用的@react-navigation系列版本可能存在资源打包逻辑问题，尝试升级到同系列稳定版本：

npm install @react-navigation/drawer@latest @react-navigation/native@latest @react-navigation/bottom-tabs@latest @react-navigation/native-stack@latest

升级完成后执行方法3的清理缓存命令，再重新打包。

项目配置信息 #

gradle/gradle.properties #

org.gradle.jvmargs=-Xmx2048m -XX:MaxMetaspaceSize=51
android.useAndroidX=true
android.enableJetifier=true
FLIPPER_VERSION=0.182.0
reactNativeArchitectures=armeabi-v7a,arm64-v8a,x86,x86_64
newArchEnabled=false
hermesEnabled=true

package.json #

{"dependencies": {
    "@fortawesome/fontawesome-svg-core": "^6.5.0",
    "@fortawesome/free-brands-svg-icons": "^6.5.0",
    "@fortawesome/free-regular-svg-icons": "^6.5.0",
    "@fortawesome/free-solid-svg-icons": "^6.5.0",
    "@fortawesome/react-native-fontawesome": "^0.3.0",
    "@react-native-async-storage/async-storage": "^1.21.0",
    "@react-native-community/datetimepicker": "^7.6.2",
    "@react-navigation/bottom-tabs": "^6.5.11",
    "@react-navigation/drawer": "^6.6.6",
    "@react-navigation/native": "^6.1.9",
    "@react-navigation/native-stack": "^6.9.17",
    "axios": "^1.6.2",
    "formik": "^2.4.5",
    "moment": "^2.29.4",
    "react": "18.2.0",
    "react-native": "0.72.7",
    "react-native-gesture-handler": "^2.14.0",
    "react-native-modal-datetime-picker": "^17.1.0",
    "react-native-reanimated": "^3.6.0",
    "react-native-safe-area-context": "^4.7.4",
    "react-native-screens": "^3.27.0",
    "react-native-svg": "^14.0.0",
    "yup": "^1.3.2"
  },
  "devDependencies": {
    "@babel/core": "^7.20.0",
    "@babel/preset-env": "^7.20.0",
    "@babel/runtime": "^7.20.0",
    "@react-native/eslint-config": "^0.72.2",
    "@react-native/metro-config": "^0.72.11",
    "@tsconfig/react-native": "^3.0.0",
    "@types/react": "^18.0.24",
    "@types/react-test-renderer": "^18.0.0",
    "babel-jest": "^29.2.1",
    "eslint": "^8.19.0",
    "jest": "^29.2.1",
    "metro-react-native-babel-preset": "0.76.8",
    "prettier": "^2.4.1",
    "react-test-renderer": "18.2.0",
    "typescript": "4.8.4"
  },
  "engines": {
    "node": ">=16"
  }}

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