TFLite with React Native Expo - APK Shows "App Not Compatible"

I’m using TensorFlow Lite (TFLite) with React Native Expo. When I test the app using the Expo Go app, everything works fine. However, when I export a debug APK, the app shows “App Not Compatible.”

Project Setup: Framework: React Native with Expo Build Type: Debug APK Library: TensorFlow Lite (TFLite)I’m using TensorFlow Lite (TFLite) with React Native Expo. When I test the app using the Expo Go app, everything works fine. However, when I export a debug APK, the app shows “App Not Compatible.”

Project Setup: Framework: React Native with Expo Build Type: Debug APK Library: TensorFlow Lite (TFLite)

Relevant Configurations:

android/app/build.gradle

apply plugin: “com.android.application”

apply plugin: “org.jetbrains.kotlin.android”

apply plugin: “com.facebook.react”

def projectRoot = rootDir.getAbsoluteFile().getParentFile().getAbsolutePath()

/**

• This is the configuration block to customize your React Native Android app.
• By default you don’t need to apply any configuration, just uncomment the lines you need.
  */

react {

entryFile = file(["node", "-e", "require('expo/scripts/resolveAppEntry')", projectRoot, "android", "absolute"].execute(null, rootDir).text.trim())

reactNativeDir = new File(["node", "--print", "require.resolve('react-native/package.json')"].execute(null, rootDir).text.trim()).getParentFile().getAbsoluteFile()

hermesCommand = new File(["node", "--print", "require.resolve('react-native/package.json')"].execute(null, rootDir).text.trim()).getParentFile().getAbsolutePath() + "/sdks/hermesc/%OS-BIN%/hermesc"

codegenDir = new File(["node", "--print", "require.resolve('@react-native/codegen/package.json', { paths: [require.resolve('react-native/package.json')] })"].execute(null, rootDir).text.trim()).getParentFile().getAbsoluteFile()



// Use Expo CLI to bundle the app, this ensures the Metro config

// works correctly with Expo projects.

cliFile = new File(["node", "--print", "require.resolve('@expo/cli', { paths: [require.resolve('expo/package.json')] })"].execute(null, rootDir).text.trim())

bundleCommand = "export:embed"



/* Folders */

 //   The root of your project, i.e. where "package.json" lives. Default is '../..'

// root = file("../../")

//   The folder where the react-native NPM package is. Default is ../../node_modules/react-native

// reactNativeDir = file("../../node_modules/react-native")

//   The folder where the react-native Codegen package is. Default is ../../node_modules/@react-native/codegen

// codegenDir = file("../../node_modules/@react-native/codegen")



/* Variants */

//   The list of variants to that are debuggable. For those we're going to

//   skip the bundling of the JS bundle and the assets. By default is just 'debug'.

//   If you add flavors like lite, prod, etc. you'll have to list your debuggableVariants.

// debuggableVariants = ["liteDebug", "prodDebug"]



/* Bundling */

//   A list containing the node command and its flags. Default is just 'node'.

// nodeExecutableAndArgs = ["node"]



//

//   The path to the CLI configuration file. Default is empty.

// bundleConfig = file(../rn-cli.config.js)

//

//   The name of the generated asset file containing your JS bundle

// bundleAssetName = "MyApplication.android.bundle"

//

//   The entry file for bundle generation. Default is 'index.android.js' or 'index.js'

// entryFile = file("../js/MyApplication.android.js")

//

//   A list of extra flags to pass to the 'bundle' commands.

//   See https://github.com/react-native-community/cli/blob/main/docs/commands.md#bundle

// extraPackagerArgs = []



/* Hermes Commands */

//   The hermes compiler command to run. By default it is 'hermesc'

// hermesCommand = "$rootDir/my-custom-hermesc/bin/hermesc"

//

//   The list of flags to pass to the Hermes compiler. By default is "-O", "-output-source-map"

// hermesFlags = ["-O", "-output-source-map"]



/* Autolinking */

autolinkLibrariesWithApp()

}

/**

• Set this to true to Run Proguard on Release builds to minify the Java bytecode.
  */

def enableProguardInReleaseBuilds = (findProperty(‘android.enableProguardInReleaseBuilds’) ?: false).toBoolean()

/**

• The preferred build flavor of JavaScriptCore (JSC)
• For example, to use the international variant, you can use:
• def jscFlavor = 'org.webkit:android-jsc-intl:+'
• The international variant includes ICU i18n library and necessary data
• allowing to use e.g. Date.toLocaleString and String.localeCompare that
• give correct results when using with locales other than en-US. Note that
• this variant is about 6MiB larger per architecture than default.
  */

def jscFlavor = ‘org.webkit:android-jsc:+’

android {

ndkVersion rootProject.ext.ndkVersion



buildToolsVersion rootProject.ext.buildToolsVersion

compileSdk rootProject.ext.compileSdkVersion



namespace 'com.anonymous.myapp_first'

defaultConfig {

    applicationId 'com.anonymous.myapp_first'

    minSdkVersion rootProject.ext.minSdkVersion

    targetSdkVersion rootProject.ext.targetSdkVersion

    versionCode 1

    versionName "1.0.0"

}

signingConfigs {

    debug {

        storeFile file('debug.keystore')

        storePassword 'android'

        keyAlias 'androiddebugkey'

        keyPassword 'android'

    }

}

buildTypes {

    debug {

        signingConfig signingConfigs.debug

    }

    release {

        // Caution! In production, you need to generate your own keystore file.

        // see https://reactnative.dev/docs/signed-apk-android.

        signingConfig signingConfigs.debug

        shrinkResources (findProperty('android.enableShrinkResourcesInReleaseBuilds')?.toBoolean() ?: false)

        minifyEnabled enableProguardInReleaseBuilds

        proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"

        crunchPngs (findProperty('android.enablePngCrunchInReleaseBuilds')?.toBoolean() ?: true)

    }

}

packagingOptions {

    jniLibs {

        useLegacyPackaging (findProperty('expo.useLegacyPackaging')?.toBoolean() ?: false)

    }

}

androidResources {

    ignoreAssetsPattern '!.svn:!.git:!.ds_store:!*.scc:!CVS:!thumbs.db:!picasa.ini:!*~'

}

}

// Apply static values from gradle.properties to the android.packagingOptions

// Accepts values in comma delimited lists, example:

// android.packagingOptions.pickFirsts=/LICENSE,**/picasa.ini

[“pickFirsts”, “excludes”, “merges”, “doNotStrip”].each { prop →

// Split option: 'foo,bar' -> ['foo', 'bar']

def options = (findProperty("android.packagingOptions.$prop") ?: "").split(",");

// Trim all elements in place.

for (i in 0..<options.size()) options[i] = options[i].trim();

// `[] - ""` is essentially `[""].filter(Boolean)` removing all empty strings.

options -= ""



if (options.length > 0) {

    println "android.packagingOptions.$prop += $options ($options.length)"

    // Ex: android.packagingOptions.pickFirsts += '**/SCCS/**'

    options.each {

        android.packagingOptions[prop] += it

    }

}

}

dependencies {

// The version of react-native is set by the React Native Gradle Plugin

implementation("com.facebook.react:react-android")



def isGifEnabled = (findProperty('expo.gif.enabled') ?: "") == "true";

def isWebpEnabled = (findProperty('expo.webp.enabled') ?: "") == "true";

def isWebpAnimatedEnabled = (findProperty('expo.webp.animated') ?: "") == "true";



if (isGifEnabled) {

    // For animated gif support

    implementation("com.facebook.fresco:animated-gif:${reactAndroidLibs.versions.fresco.get()}")

}



if (isWebpEnabled) {

    // For webp support

    implementation("com.facebook.fresco:webpsupport:${reactAndroidLibs.versions.fresco.get()}")

    if (isWebpAnimatedEnabled) {

        // Animated webp support

        implementation("com.facebook.fresco:animated-webp:${reactAndroidLibs.versions.fresco.get()}")

    }

}



if (hermesEnabled.toBoolean()) {

    implementation("com.facebook.react:hermes-android")

} else {

    implementation jscFlavor

}

}

and here is my android/build.gradle

// Top-level build file where you can add configuration options common to all sub-projects/modules.

buildscript {

ext {

    buildToolsVersion = findProperty('android.buildToolsVersion') ?: '35.0.0'

    minSdkVersion = Integer.parseInt(findProperty('android.minSdkVersion') ?: '24')

    compileSdkVersion = Integer.parseInt(findProperty('android.compileSdkVersion') ?: '35')

    targetSdkVersion = Integer.parseInt(findProperty('android.targetSdkVersion') ?: '34')

    kotlinVersion = findProperty('android.kotlinVersion') ?: '1.9.24'



    ndkVersion = "26.1.10909125"

}

repositories {

    google()

    mavenCentral()

}

dependencies {

    classpath('com.android.tools.build:gradle')

    classpath('com.facebook.react:react-native-gradle-plugin')

    classpath('org.jetbrains.kotlin:kotlin-gradle-plugin')

}

}

apply plugin: “com.facebook.react.rootproject”

allprojects {

repositories {

    maven {

        // All of React Native (JS, Obj-C sources, Android binaries) is installed from npm

        url(new File(['node', '--print', "require.resolve('react-native/package.json')"].execute(null, rootDir).text.trim(), '../android'))

    }

    maven {

        // Android JSC is installed from npm

        url(new File(['node', '--print', "require.resolve('jsc-android/package.json', { paths: [require.resolve('react-native/package.json')] })"].execute(null, rootDir).text.trim(), '../dist'))

    }



    google()

    mavenCentral()

    maven { url 'https://www.jitpack.io' }

}

}

and here is my react native package.json

{

“name”: “myapp_first”,

“main”: “expo-router/entry”,

“version”: “1.0.0”,

“scripts”: {

"start": "expo start",

"reset-project": "node ./scripts/reset-project.js",

"android": "expo run:android",

"ios": "expo run:ios",

"web": "expo start --web",

"test": "jest --watchAll",

"lint": "expo lint"

},

“jest”: {

"preset": "jest-expo"

},

“dependencies”: {

"@expo/vector-icons": "^14.0.2",

"@react-navigation/bottom-tabs": "^7.0.0",

"@react-navigation/native": "^7.0.13",

"@react-navigation/stack": "^7.0.18",

"axios": "^1.7.8",

"expo": "~52.0.11",

"expo-barcode-scanner": "^13.0.1",

"expo-blur": "~14.0.1",

"expo-camera": "~16.0.7",

"expo-constants": "~17.0.3",

"expo-font": "~13.0.1",

"expo-haptics": "~14.0.0",

"expo-image-picker": "~16.0.3",

"expo-linking": "~7.0.3",

"expo-router": "~4.0.9",

"expo-splash-screen": "~0.29.13",

"expo-status-bar": "~2.0.0",

"expo-symbols": "~0.2.0",

"expo-system-ui": "~4.0.4",

"expo-web-browser": "~14.0.1",

"lucide-react-native": "^0.462.0",

"react": "18.3.1",

"react-dom": "18.3.1",

"react-native": "0.76.3",

"react-native-gesture-handler": "~2.20.2",

"react-native-paper": "^5.12.5",

"react-native-reanimated": "~3.16.1",

"react-native-safe-area-context": "^4.14.0",

"react-native-screens": "~4.1.0",

"react-native-svg": "^15.9.0",

"react-native-vector-icons": "^10.2.0",

"react-native-web": "~0.19.13",

"react-native-webview": "13.12.2",

"tflite-react-native": "^0.0.5"

},

“devDependencies”: {

"@babel/core": "^7.25.2",

"@react-native-community/cli": "^16.0.0",

"@types/jest": "^29.5.12",

"@types/react": "~18.3.12",

"@types/react-test-renderer": "^18.3.0",

"jest": "^29.2.1",

"jest-expo": "~52.0.2",

"react-test-renderer": "18.3.1",

"typescript": "^5.3.3"

},

“private”: true

}

and here is the error while installing the debug app

error while installing the debug app - app not installed as app is not compatible with your phone

And here also my java version - java version “21.0.2” 2024-01-16 LTS Java™ SE Runtime Environment (build 21.0.2+13-LTS-58) Java HotSpot™ 64-Bit Server VM (build 21.0.2+13-LTS-58, mixed mode, sharing)

Tried: Try updating minSdkVersion to 26. Add abiFilters for TFLite support. Disable Hermes if needed. Run adb logcat to get more debug info.