[Android] Error: Duplicate resources

[jeffreyrajanofficial]

• Review the documentation: https://facebook.github.io/react-native
• Search for existing issues: https://github.com/facebook/react-native/issues
• Use the latest React Native release: https://github.com/facebook/react-native/releases

Environment

React Native Environment Info:

System:
  OS: macOS 10.14
  CPU: (4) x64 Intel(R) Core(TM) i5-7267U CPU @ 3.10GHz
  Memory: 103.10 MB / 8.00 GB
  Shell: 3.2.57 - /bin/bash
Binaries:
  Node: 8.12.0 - /usr/local/bin/node
  Yarn: 1.0.1 - /usr/local/bin/yarn
  npm: 6.4.1 - /usr/local/bin/npm
  Watchman: 4.7.0 - /usr/local/bin/watchman
SDKs:
  iOS SDK:
    Platforms: iOS 12.1, macOS 10.14, tvOS 12.1, watchOS 5.1
  Android SDK:
    API Levels: 16, 17, 19, 21, 23, 24, 25, 26, 27, 28
    Build Tools: 19.1.0, 20.0.0, 23.0.1, 23.0.2, 23.0.3, 25.0.0, 25.0.1, 25.0.2, 25.0.3, 26.0.0, 26.0.1, 26.0.2, 26.0.3, 27.0.0, 27.0.1, 27.0.3, 28.0.0, 28.0.0, 28.0.2, 28.0.3
    System Images: android-16 | ARM EABI v7a, android-16 | MIPS, android-16 | Intel x86 Atom, android-16 | Google APIs Intel x86 Atom, android-19 | Google APIs Intel x86 Atom, android-24 | Google Play Intel x86 Atom, android-26 | Google APIs Intel x86 Atom, android-26 | Google APIs Intel x86 Atom_64, android-26 | Google Play Intel x86 Atom, android-27 | Google Play Intel x86 Atom, android-28 | Google APIs Intel x86 Atom, android-P | Google APIs Intel x86 Atom, android-P | Google Play Intel x86 Atom
IDEs:
  Android Studio: 3.2 AI-181.5540.7.32.5056338
  Xcode: 10.1/10B61 - /usr/bin/xcodebuild
npmPackages:
  react: 16.6.0-alpha.8af6728 => 16.6.0-alpha.8af6728 
  react-native: 0.57.4 => 0.57.4 
npmGlobalPackages:
  babel-preset-react-native: 4.0.0
  react-native-cli: 2.0.1
  react-native-create-library: 3.1.2
  react-native-git-upgrade: 0.2.7

Description

I'm not able to create a release apk with the PNG image in Android. But can able to create a release apk when there is no PNG image in it. Here is the error I'm getting while generating the release build

[drawable-mdpi-v4/assets_mario] /Users/jeffreyrajan/Tutorials/RN/errorCheck/android/app/src/main/res/drawable-mdpi/assets_mario.png	[drawable-mdpi-v4/assets_mario] /Users/jeffreyrajan/Tutorials/RN/errorCheck/android/app/build/generated/res/react/release/drawable-mdpi-v4/assets_mario.png: Error: Duplicate resources
:app:mergeReleaseResources FAILED

FAILURE: Build failed with an exception.

* What went wrong:
Execution failed for task ':app:mergeReleaseResources'.
> [drawable-mdpi-v4/assets_mario] /Users/jeffreyrajan/Tutorials/RN/errorCheck/android/app/src/main/res/drawable-mdpi/assets_mario.png	[drawable-mdpi-v4/assets_mario] /Users/jeffreyrajan/Tutorials/RN/errorCheck/android/app/build/generated/res/react/release/drawable-mdpi-v4/assets_mario.png: Error: Duplicate resources

* Try:
Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output. Run with --scan to get full insights.

* Get more help at https://help.gradle.org

Reproducible Demo

1. Create a app - react-native init demo
2. Create a assets folder in the project root folder.
3. Add a PNG image inside the assets folder.
4. Now implement a image component with the above PNG image.
5. Now bundle it using the cmd
   react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res/
6. Then generate release apk using Generate Signed APK

[ZeroCool00]

check this #19239 (comment)

You need to remove drawable folder image if there is any?

[jeffreyrajanofficial]

@ZeroCool00 wont that affect the images in Android?

[echaritonidis]

Mapsy's answer should help https://stackoverflow.com/a/52750886
So basically you edit the /node_modules/react-native/react.gradle file
and add the doLast right after the doFirst block, manually.

doFirst { ... }
doLast {
    def moveFunc = { resSuffix ->
        File originalDir = file("$buildDir/generated/res/react/release/drawable-${resSuffix}");
        if (originalDir.exists()) {
            File destDir = file("$buildDir/../src/main/res/drawable-${resSuffix}");
            ant.move(file: originalDir, tofile: destDir);
        }
    }
    moveFunc.curry("ldpi").call()
    moveFunc.curry("mdpi").call()
    moveFunc.curry("hdpi").call()
    moveFunc.curry("xhdpi").call()
    moveFunc.curry("xxhdpi").call()
    moveFunc.curry("xxxhdpi").call()
}

[jeffreyrajanofficial]

@ZeroCool00 @mkchx I checked with both of your answer, its working. Thanks a lot guys :)

[vivek-walecha-657-zz]

Hi all how will we able to get this done with jenkins job. As it will do npm install always which override this change in react.gradle file. We can create build on android studio for android but not possible on jenkins.

[jeffreyrajanofficial]

Hi @vivek-walecha-657 I haven't tried this but you can try this command for creating offline bundling

react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle

[vivek-walecha-657-zz]

@jeffreyrajanofficial Thanx for writing, the solution you have provided will help if we go and change react.gradle file. But I don't want to make the release by changing the react.gradle file every time i do npm install everywhere.

[vivek-walecha-657-zz]

@jeffreyrajanofficial Can you please tell which version(latest lower than this or higher than this) is working fine, without this issue. Because release notes don't tell anything that this issue is resolved.

[vivek-walecha-657-zz]

Things are sorted now in RN > 57 react.gradle file automatically creates the bundle.
for creating a release build you dont need to run the npm run build:android:release

[abhishekgargx]

Using 55.4 react native version here is my sample project gist for build.gradle package.json with fixes.

https://gist.github.com/Abhishekgarg727/daf031fb9f94fdfd985e84db57dedbe1

[mikehardy]

I was still seeing this, using macOS 10.14.3 + RN 0.57.8 + Android Studio 3.3 + Gradle 4.10.3. Maybe I'm not the only one? Or maybe someone here can confirm it works so I'll dig more and fix it for myself for real.

I'm currently working around it with the "patch-package" package in combination with the attached patch based on the above comment from @mkchx (with .txt suffix appended so github would accept the attachment) in order to automagically fix it on 'npm install' after adding postinstall: patch-package to my package.json scripts.

Maybe this is useful to someone...
react-native+0.57.8.patch.txt

[rahulkumar1409]

Remove the files you might have on:

android/app/src/main/res/drawable-mdpi/
android/app/src/main/res/drawable-xhdpi/
android/app/src/main/res/drawable-xxhdpi/
Run Build again, This fixed the issue for me.