I created a custom dev client, which has been working fine. However, I recently enabled product flavors on Android and product schemes on iOS, with different bundleIdentifiers (applicationIds for Android). Now, when I run expo start --dev-client from the command line, then press a to load the app on an Android emulator that has the dev client installed, I’m getting an error:
› Opening com.terramera.stewardappmvp://expo-development-client/?url=http%3A%2F%2F192.168.1.210%3A8081 on Pixel_3_XL_API_30
Couldn't start project on Android: Error running adb: The development client (com.terramera.stewardappmvp) for this project is not installed. Please build and install the client on the device first.
It’s cleary referencing the wrong client, as I can confirm that the dev client is installed. The development client should actually be com.terramera.stewardappmvp.dev. I was able to fix a similar problem on iOS by specifying the bundleIdentifier in my app.config.ts. I’m wondering if I missed some configuration somewhere for Android. I’ll add some config files below. Any help would be appreciated. Please let me know what additional information you might need.
eas.json
{
"cli": {
"version": ">= 0.47.0"
},
"build": {
"development": {
"developmentClient": "true",
"releaseChannel": "dev",
"distribution": "internal",
"android": {
"gradleCommand": ":app:assembleDevelopmentDebug"
},
"ios": {
"buildConfiguration": "Debug",
"scheme": "steward-dev"
}
},
"development-simulator": {
"distribution": "internal",
"developmentClient": "true",
"releaseChannel": "dev",
"ios": {
"simulator": "true",
"scheme": "steward-dev"
}
},
"staging": {
"distribution": "internal",
"releaseChannel": "staging",
"android": {
"gradleCommand": ":app:assemblePreviewRelease"
},
"ios": {
"scheme": "steward-preview"
}
},
"production": {
"releaseChannel": "prod",
"android": {
"gradleCommand": ":app:assembleProductionRelease"
},
"ios": {
"scheme": "steward-prod"
}
}
},
"submit": {
"production": {}
}
}
app.config.ts
const env = process.env.ENV;
const BUNDLE_ID = 'com.terramera.stewardappmvp';
const getBundleId = () => {
if (env === 'development') {
return `${BUNDLE_ID}.dev`;
}
if (env === 'staging') {
return `${BUNDLE_ID}.preview`;
}
return BUNDLE_ID;
};
export default {
slug: 'terramera-steward',
owner: 'terramera',
extra: {
comment:
'Please see this URL: https://twitter.com/Baconbrix/status/1412921581542658049?s=20\nBasically, this string has to be written to a specific file which is what Flipper looks for',
flipperHack: 'React Native packager is running',
},
version: '0.0.1',
orientation: 'portrait',
jsEngine: 'jsc',
icon: './assets/icon.png',
splash: {
image: './assets/splash.png',
resizeMode: 'contain',
backgroundColor: '#ffffff',
},
updates: {
fallbackToCacheTimeout: 0,
},
assetBundlePatterns: ['**/*'],
ios: {
supportsTablet: true,
usesIcloudStorage: true,
infoPlist: {
NSFaceIDUsageDescription: 'We use face ID to authenticate you to protect your data',
},
bundleIdentifier: getBundleId(),
},
android: {
adaptiveIcon: {
foregroundImage: './assets/adaptive-icon.png',
backgroundColor: '#FFFFFF',
},
package: getBundleId(),
},
web: {
favicon: './assets/favicon.png',
},
plugins: [
'@react-native-mapbox-gl/maps',
[
'expo-document-picker',
{ appleTeamId: 'AV32N8PZ99', iCloudContainerEnvironment: 'Production' },
],
[
'expo-community-flipper',
{
Flipper: '0.140.0',
ios: {
'Flipper-Folly': '2.6.10',
'Flipper-DoubleConversion': '3.2.0',
'Flipper-Glog': '0.5.0.3',
'Flipper-PeerTalk': '0.0.4',
},
},
],
],
};
app/build.gradle
apply plugin: "com.android.application"
import com.android.build.OutputFile
/**
* The react.gradle file registers a task for each build variant (e.g. bundleDebugJsAndAssets
* and bundleReleaseJsAndAssets).
* These basically call `react-native bundle` with the correct arguments during the Android build
* cycle. By default, bundleDebugJsAndAssets is skipped, as in debug/dev mode we prefer to load the
* bundle directly from the development server. Below you can see all the possible configurations
* and their defaults. If you decide to add a configuration block, make sure to add it before the
* `apply from: "../../node_modules/react-native/react.gradle"` line.
*
* project.ext.react = [
* // the name of the generated asset file containing your JS bundle
* bundleAssetName: "index.android.bundle",
*
* // the entry file for bundle generation. If none specified and
* // "index.android.js" exists, it will be used. Otherwise "index.js" is
* // default. Can be overridden with ENTRY_FILE environment variable.
* entryFile: "index.android.js",
*
* // https://reactnative.dev/docs/performance#enable-the-ram-format
* bundleCommand: "ram-bundle",
*
* // whether to bundle JS and assets in debug mode
* bundleInDebug: false,
*
* // whether to bundle JS and assets in release mode
* bundleInRelease: true,
*
* // whether to bundle JS and assets in another build variant (if configured).
* // See http://tools.android.com/tech-docs/new-build-system/user-guide#TOC-Build-Variants
* // The configuration property can be in the following formats
* // 'bundleIn${productFlavor}${buildType}'
* // 'bundleIn${buildType}'
* // bundleInFreeDebug: true,
* // bundleInPaidRelease: true,
* // bundleInBeta: true,
*
* // whether to disable dev mode in custom build variants (by default only disabled in release)
* // for example: to disable dev mode in the staging build type (if configured)
* devDisabledInStaging: true,
* // The configuration property can be in the following formats
* // 'devDisabledIn${productFlavor}${buildType}'
* // 'devDisabledIn${buildType}'
*
* // the root of your project, i.e. where "package.json" lives
* root: "../../",
*
* // where to put the JS bundle asset in debug mode
* jsBundleDirDebug: "$buildDir/intermediates/assets/debug",
*
* // where to put the JS bundle asset in release mode
* jsBundleDirRelease: "$buildDir/intermediates/assets/release",
*
* // where to put drawable resources / React Native assets, e.g. the ones you use via
* // require('./image.png')), in debug mode
* resourcesDirDebug: "$buildDir/intermediates/res/merged/debug",
*
* // where to put drawable resources / React Native assets, e.g. the ones you use via
* // require('./image.png')), in release mode
* resourcesDirRelease: "$buildDir/intermediates/res/merged/release",
*
* // by default the gradle tasks are skipped if none of the JS files or assets change; this means
* // that we don't look at files in android/ or ios/ to determine whether the tasks are up to
* // date; if you have any other folders that you want to ignore for performance reasons (gradle
* // indexes the entire tree), add them here. Alternatively, if you have JS files in android/
* // for example, you might want to remove it from here.
* inputExcludes: ["android/**", "ios/**"],
*
* // override which node gets called and with what additional arguments
* nodeExecutableAndArgs: ["node"],
*
* // supply additional arguments to the packager
* extraPackagerArgs: []
* ]
*/
project.ext.react = [
enableHermes: (findProperty('expo.jsEngine') ?: "jsc") == "hermes",
cliPath: new File(["node", "--print", "require.resolve('react-native/package.json')"].execute(null, rootDir).text.trim()).getParentFile().getAbsolutePath() + "/cli.js",
hermesCommand: new File(["node", "--print", "require.resolve('hermes-engine/package.json')"].execute(null, rootDir).text.trim()).getParentFile().getAbsolutePath() + "/%OS-BIN%/hermesc",
composeSourceMapsPath: new File(["node", "--print", "require.resolve('react-native/package.json')"].execute(null, rootDir).text.trim()).getParentFile().getAbsolutePath() + "/scripts/compose-source-maps.js",
]
apply from: new File(["node", "--print", "require.resolve('react-native/package.json')"].execute(null, rootDir).text.trim(), "../react.gradle")
/**
* Set this to true to create two separate APKs instead of one:
* - An APK that only works on ARM devices
* - An APK that only works on x86 devices
* The advantage is the size of the APK is reduced by about 4MB.
* Upload all the APKs to the Play Store and people will download
* the correct one based on the CPU architecture of their device.
*/
def enableSeparateBuildPerCPUArchitecture = false
/**
* Run Proguard to shrink the Java bytecode in release builds.
*/
def enableProguardInReleaseBuilds = false
/**
* The preferred build flavor of JavaScriptCore.
*
* 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:+'
/**
* Whether to enable the Hermes VM.
*
* This should be set on project.ext.react and mirrored here. If it is not set
* on project.ext.react, JavaScript will not be compiled to Hermes Bytecode
* and the benefits of using Hermes will therefore be sharply reduced.
*/
def enableHermes = project.ext.react.get("enableHermes", false);
android {
compileSdkVersion rootProject.ext.compileSdkVersion
compileOptions {
sourceCompatibility JavaVersion.VERSION_1_8
targetCompatibility JavaVersion.VERSION_1_8
}
defaultConfig {
applicationId 'com.terramera.stewardappmvp'
minSdkVersion rootProject.ext.minSdkVersion
targetSdkVersion rootProject.ext.targetSdkVersion
versionCode 1
versionName "1.0.0"
}
splits {
abi {
reset()
enable enableSeparateBuildPerCPUArchitecture
universalApk false // If true, also generate a universal APK
include "armeabi-v7a", "x86", "arm64-v8a", "x86_64"
}
}
signingConfigs {
debug {
storeFile file('debug.keystore')
storePassword 'android'
keyAlias 'androiddebugkey'
keyPassword 'android'
}
}
flavorDimensions "env"
productFlavors {
production {
dimension "env"
applicationId 'com.terramera.stewardappmvp'
}
development {
dimension "env"
applicationId 'com.terramera.stewardappmvp.dev'
}
preview {
dimension "env"
applicationId 'com.terramera.stewardappmvp.preview'
}
}
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
minifyEnabled enableProguardInReleaseBuilds
proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"
}
}
// applicationVariants are e.g. debug, release
applicationVariants.all { variant ->
variant.outputs.each { output ->
// For each separate APK per architecture, set a unique version code as described here:
// https://developer.android.com/studio/build/configure-apk-splits.html
def versionCodes = ["armeabi-v7a": 1, "x86": 2, "arm64-v8a": 3, "x86_64": 4]
def abi = output.getFilter(OutputFile.ABI)
if (abi != null) { // null for the universal-debug, universal-release variants
output.versionCodeOverride =
versionCodes.get(abi) * 1048576 + defaultConfig.versionCode
}
}
}
}
dependencies {
implementation fileTree(dir: "libs", include: ["*.jar"])
//noinspection GradleDynamicVersion
implementation "com.facebook.react:react-native:+" // From node_modules
def isGifEnabled = (findProperty('expo.gif.enabled') ?: "") == "true";
def isWebpEnabled = (findProperty('expo.webp.enabled') ?: "") == "true";
def isWebpAnimatedEnabled = (findProperty('expo.webp.animated') ?: "") == "true";
// If your app supports Android versions before Ice Cream Sandwich (API level 14)
// All fresco packages should use the same version
if (isGifEnabled || isWebpEnabled) {
implementation 'com.facebook.fresco:fresco:2.0.0'
implementation 'com.facebook.fresco:imagepipeline-okhttp3:2.0.0'
}
if (isGifEnabled) {
// For animated gif support
implementation 'com.facebook.fresco:animated-gif:2.0.0'
}
if (isWebpEnabled) {
// For webp support
implementation 'com.facebook.fresco:webpsupport:2.0.0'
if (isWebpAnimatedEnabled) {
// Animated webp support
implementation 'com.facebook.fresco:animated-webp:2.0.0'
}
}
implementation "androidx.swiperefreshlayout:swiperefreshlayout:1.0.0"
debugImplementation("com.facebook.flipper:flipper:${FLIPPER_VERSION}") {
exclude group:'com.facebook.fbjni'
}
debugImplementation("com.facebook.flipper:flipper-network-plugin:${FLIPPER_VERSION}") {
exclude group:'com.facebook.flipper'
exclude group:'com.squareup.okhttp3', module:'okhttp'
}
debugImplementation("com.facebook.flipper:flipper-fresco-plugin:${FLIPPER_VERSION}") {
exclude group:'com.facebook.flipper'
}
if (enableHermes) {
debugImplementation files(new File(["node", "--print", "require.resolve('hermes-engine/package.json')"].execute(null, rootDir).text.trim(), "../android/hermes-debug.aar"))
releaseImplementation files(new File(["node", "--print", "require.resolve('hermes-engine/package.json')"].execute(null, rootDir).text.trim(), "../android/hermes-release.aar"))
} else {
implementation jscFlavor
}
}
// Run this once to be able to run the application with BUCK
// puts all compile dependencies into folder libs for BUCK to use
task copyDownloadableDepsToLibs(type: Copy) {
from configurations.compile
into 'libs'
}
apply from: new File(["node", "--print", "require.resolve('@react-native-community/cli-platform-android/package.json')"].execute(null, rootDir).text.trim(), "../native_modules.gradle");
applyNativeModulesAppBuildGradle(project)