java.lang.RuntimeException: Unable to load script. Make sure you're either running Metro (run 'npx react-native start') on React-native 0.70.6

nirikshan commented 1 year ago

New Version

0.70.6

Old Version

0.66.0

Build Target(s)

Android

Output of `react-native info`

System: OS: macOS 13.0.1 CPU: (8) arm64 Apple M1 Memory: 41.77 MB / 16.00 GB Shell: 5.8.1 - /bin/zsh Binaries: Node: 16.7.0 - /usr/local/bin/node Yarn: 1.22.17 - /usr/local/bin/yarn npm: 8.1.1 - /usr/local/bin/npm Watchman: 2022.09.05.00 - /opt/homebrew/bin/watchman Managers: CocoaPods: 1.11.3 - /opt/homebrew/bin/pod SDKs: iOS SDK: Platforms: DriverKit 21.4, iOS 15.5, macOS 12.3, tvOS 15.4, watchOS 8.5 Android SDK: API Levels: 23, 27, 28, 29, 30, 31, 33 Build Tools: 28.0.3, 29.0.0, 29.0.1, 29.0.2, 30.0.2, 30.0.3, 31.0.0 System Images: android-29 | Google APIs ARM 64 v8a, android-29 | Google APIs Intel x86 Atom, android-29 | Google APIs Intel x86 Atom_64, android-30 | Google APIs ARM 64 v8a, android-30 | Google APIs Intel x86 Atom, android-31 | Google APIs ARM 64 v8a, android-31 | Google Play ARM 64 v8a, android-33 | Google Play ARM 64 v8a Android NDK: Not Found IDEs: Android Studio: 2020.3 AI-203.7717.56.2031.7583922 Xcode: 13.4.1/13F100 - /usr/bin/xcodebuild Languages: Java: 18.0.1.1 - /opt/homebrew/opt/openjdk/bin/javac npmPackages: @react-native-community/cli: Not Found react: 18.1.0 => 18.1.0 react-native: 0.70.6 => 0.70.6 react-native-macos: Not Found npmGlobalPackages: react-native: Not Found

Issue and Reproduction Steps

Currently, I have completed updating my project to React-Native 0.70.6 (The Latest). Everything is working as expected during development (npm run android) and Apk builds process also generates APK without any error. But when I run my Final APK app suddenly crashes without any error. To detect the reason for crash I have used several debugging tools. Which gives me the error as shown below

java.lang.RuntimeException: Unable to load script. 
Make sure you're either running Metro (run 'npx react-native start') or that your bundle 'index.android.bundle' is packaged correctly for release.
at com.facebook.react.bridge.CatalystInstanceImpl.jniLoadScriptFromAssets(Native Method)
at com.facebook.react.bridge.CatalystInstanceImpl.loadScriptFr assets(CatalystInstanceImpl.java:248)
at com.facebook.react.bridge.JSBundleLoader $1.loadScript(JSBundleLoader.java:29)
at com.facebook.react.bridge.CatalystInstanceImpl.runJSBundl e(CatalystInstanceImpl.java:277)
at com.facebook.react.ReactInstanceManager.createReactCont ext(ReactInstanceManager.java:1402)
at com.facebook.react.ReactInstanceManager.access $1200(ReactInstanceManager.java:136)
at com.facebook.react.ReactInstanceManager
$5.run(ReactInstanceManager.java:1108) at java.lang.Thread.run(Thread.java:818)

I have searched everywhere about this problem on the web. I read several posts and got several suggestions that I have implemented in my files.

My android/build.gradle file :

    buildscript {
    ext {
        buildToolsVersion = "31.0.0"
        minSdkVersion = 21
        compileSdkVersion = 31
        targetSdkVersion = 31
        if (System.properties['os.arch'] == "aarch64") {
            ndkVersion = "24.0.8215888"
        } else {
            ndkVersion = "21.4.7075529"
        }
        googlePlayServicesAuthVersion = "19.2.0"
        firebaseMessagingVersion = "21.1.0" 
    }
    repositories {
        google()
        mavenCentral()
    }
    dependencies {
        classpath("com.android.tools.build:gradle:7.2.1")
        classpath("com.facebook.react:react-native-gradle-plugin")
        classpath("de.undercouch:gradle-download-task:5.0.1")
        classpath 'com.google.gms:google-services:4.3.14'
    }
}

 allprojects {
    repositories {
        maven {
            url("$rootDir/../node_modules/react-native/android")
        }
        maven {
            // Android JSC is installed from npm
            url("$rootDir/../node_modules/jsc-android/dist")
        }
        mavenCentral {
            content {
                excludeGroup "com.facebook.react"
            }
        }
        google()
        maven { url 'https://www.jitpack.io' }
    }
}

Few configurations of android/app/build.gradle

  // other code .....
    project.ext.react = [
      enableHermes: true,  
      entryFile: "index.js",
      bundleAssetName: "index.android.bundle",
      bundleInDebug: true,
      bundleInRelease: true
   ]

   def enableSeparateBuildPerCPUArchitecture = true
   def enableProguardInReleaseBuilds = true

   android {
      ndkVersion rootProject.ext.ndkVersion
      compileSdkVersion rootProject.ext.compileSdkVersion

      defaultConfig {
        applicationId "com.myapp"
        minSdkVersion rootProject.ext.minSdkVersion
        targetSdkVersion rootProject.ext.targetSdkVersion
        versionCode 1
        versionName "1.0"
        buildConfigField "boolean", "IS_NEW_ARCHITECTURE_ENABLED", isNewArchitectureEnabled().toString()
        multiDexEnabled true

        if (isNewArchitectureEnabled()) {
            // We configure the CMake build only if you decide to opt-in for the New Architecture.
            externalNativeBuild {
                cmake {
                    arguments "-DPROJECT_BUILD_DIR=$buildDir",
                        "-DREACT_ANDROID_DIR=$rootDir/../node_modules/react-native/ReactAndroid",
                        "-DREACT_ANDROID_BUILD_DIR=$rootDir/../node_modules/react-native/ReactAndroid/build",
                        "-DNODE_MODULES_DIR=$rootDir/../node_modules",
                        "-DANDROID_STL=c++_shared"
                }
            }
            if (!enableSeparateBuildPerCPUArchitecture) {
                ndk {
                    abiFilters (*reactNativeArchitectures())
                }
            }
        }
    }

     splits {
        abi {
            reset()
            enable enableSeparateBuildPerCPUArchitecture
            universalApk true  // If true, also generate a universal APK
            include (*reactNativeArchitectures())
        }
    }
    signingConfigs {
        debug {
            storeFile file('debug.keystore')
            storePassword 'android'
            keyAlias 'androiddebugkey'
            keyPassword 'android'
        }
        release {
            if (project.hasProperty('MYAPP_UPLOAD_STORE_FILE')) {
                storeFile file(MYAPP_UPLOAD_STORE_FILE)
                storePassword MYAPP_UPLOAD_STORE_PASSWORD
                keyAlias MYAPP_UPLOAD_KEY_ALIAS
                keyPassword MYAPP_UPLOAD_KEY_PASSWORD
            }
        }
    }
    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.release
            minifyEnabled enableProguardInReleaseBuilds
            proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"
        }
    }
    // other code ......
 }

Result of java --version

    openjdk version "18.0.1.1" 2022-04-22
    OpenJDK Runtime Environment Homebrew (build 18.0.1.1+0)
    OpenJDK 64-Bit Server VM Homebrew (build 18.0.1.1+0, mixed mode, sharing)

I have tried creating a fully new project on react native 0.70.6 and generated a signed app which worked fine but didn't work with dependencies. I found using dependencies creates this problem

My package.json :

{
  "name": "myappname",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "android": "react-native run-android",
    "ios": "react-native run-ios",
    "start": "react-native start",
    "test": "jest",
    "lint": "eslint ."
  },
  "dependencies": {
    "@react-native-async-storage/async-storage": "^1.17.11",
    "@react-native-community/datetimepicker": "^6.7.0",
    "@react-native-community/netinfo": "^9.3.6",
    "@react-native-community/slider": "^4.3.3",
    "@react-native-firebase/app": "^16.4.6",
    "@react-native-firebase/auth": "^16.4.6",
    "@react-native-firebase/messaging": "^16.4.6",
    "@react-native-google-signin/google-signin": "^8.2.1",
    "@react-navigation/bottom-tabs": "^6.4.0",
    "@react-navigation/drawer": "^6.5.0",
    "@react-navigation/material-bottom-tabs": "^6.2.4",
    "@react-navigation/material-top-tabs": "^6.3.0",
    "@react-navigation/native": "^6.0.13",
    "@react-navigation/native-stack": "^6.9.1",
    "@react-navigation/stack": "^6.3.4",
    "@react-navigation/tabs": "^0.0.0-alpha.12",
    "deprecated-react-native-prop-types": "^2.3.0",
    "react": "18.1.0",
    "react-native": "0.70.6",
    "react-native-actions-sheet": "^0.8.10",
    "react-native-gradle-plugin": "^0.72.1",
    "react-native-image-slider-banner": "^1.0.3",
    "react-native-loading-spinner-overlay": "^3.0.1",
    "react-native-pager-view": "^6.1.0",
    "react-native-paper": "^4.12.5",
    "react-native-paper-tabs": "^0.7.0",
    "react-native-push-notification": "^8.1.1",
    "react-native-safe-area-context": "^4.4.1",
    "react-native-screens": "^3.18.2",
    "react-native-snap-carousel": "^3.9.1",
    "react-native-splash-screen": "^3.3.0",
    "react-native-svg": "^13.6.0",
    "react-redux": "^8.0.5",
    "redux-thunk": "^2.4.2"
  },
  "devDependencies": {
    "@babel/core": "^7.12.9",
    "@babel/runtime": "^7.12.5",
    "@react-native-community/eslint-config": "^2.0.0",
    "babel-jest": "^26.6.3",
    "eslint": "^7.32.0",
    "jest": "^26.6.3",
    "metro-react-native-babel-preset": "0.72.3",
    "react-test-renderer": "18.1.0"
  },
  "jest": {
    "preset": "react-native"
  }
}

Please help me

v-x2 commented 1 year ago

Same issue here.. always with 0.70.6...

tomcheung1208 commented 1 year ago

I have same issue, even 0.70.5 and 0.70.6. Anyone can help? My company is waiting the build. thanks so much

Fipsiflip commented 1 year ago

same issue here as well, RN v.0.70.6

SusulAdam commented 1 year ago

I have the same issue after upgrade RN from 0.70.3 to 0.70.6

cortinico commented 1 year ago

I have tried creating a fully new project on react native 0.70.6 and generated a signed app which worked fine but didn't work with dependencies

@nirikshan you should try to understand which dependency is creating this issue. If a blank project is working fine, there is not much we can do at this stage.

To all the others commenting "same issue": please provide a reproducer or refrain from hijacking other issue reports.

SusulAdam commented 1 year ago

I think that dependencies are of no greater importance here. The problem it is in the gradle version: Downgrade gradle helps me in my case. In: android/gradle/wrapper/gradle-wrapper.properties i changed version from 7.5.1 to 7.3.3. In: android/build.gradle i changed gradle from : classpath("com.android.tools.build:gradle:7.2.1") to classpath("com.android.tools.build:gradle:7.1.1")

cortinico commented 1 year ago

I think that dependencies are of no greater importance here. The problem it is in the gradle version:

They are instead. If a newly created project on 0.70.6 works correclty, then the issue is in either a user configuration (i.e. changing Gradle/AGP version as you're suggesting) or in a 3rd party dependency.

freisinho commented 1 year ago

Hello everyone, I had the same problem as yours when generating my release version, @cortinico is correct, it must be some incompatibility between libraries, in my case, there was the following in the project: react-native-gradle-plugin, I just removed it from package.json and everything worked fine.

nirikshan commented 1 year ago

@SusulAdam's comment has helped me. I followed what he told me and also downgraded react-native-gradle-plugin at package.json to 0.70.3 . Currently I have react-native 0.70.6 and It's working perfectly.

cortinico commented 1 year ago

I followed what he told me and also downgraded react-native-gradle-plugin at package.json to 0.70.3

Just a heads up that downgrading react-native-gradle-plugin is not the right solution. It's a workaround for an underlying issue. You will have problems when you try to upgrade to .71 once it's out if you keep on with this workaround.

Also you should not have react-native-gradle-plugin in your package.json at all as that dependency is provided by react-native.

freisinho commented 1 year ago

Well, when I ran it to generate the assemble I received an error coming from a library react-native-device-country, because it had incompatible versions, when I installed react-native-gradle-plugin in the package.json the error disappeared, but this error message Unable to load script... started to appear, in my case I solved it by updating the

DeviceCountry_compileSdkVersio=31 
DeviceCountry_targetSdkVersion=31

After that, I removed react-native-gradle-plugin, and I didn't get any more problems.

So my tip to try to identify which lib is in conflict is to remove react-native-gradle-plugin, and run ./gradlew assembleRelease And see if there are any problems.

After that, try to solve it together with the library maintainers, with PRs etc...

cheehieu commented 1 year ago

Just wanted to add another data point. I recently made the upgrade to React Native 0.70.7 (previously from 0.69.x and 0.67.x). I was able to build and deploy releases locally, but the app would crash when installing internal builds from the Google Play store. I was seeing errors like:

java.lang.RuntimeException:` Unable to load script. Make sure you're either running Metro (run 'npx react-native start') or that your bundle 'index.android.bundle' is packaged correctly for release

As mentioned above, the solution was to remove react-native-gradle-plugin and now release builds are no longer crashing on app launch! It looks like that library was an artifact from my RN 0.69 upgrade migration. Same with react-native-codegen.

heyalexchoi commented 10 months ago

Here's my solution, may or may not work for you:

My index.android.bundle was making it into the app bundle but incorrectly nested in a directory: assets/mergeStagingReleaseAssets/index.android.bundle. I added flavors to my app for staging and production environments and upgraded AGP for compatibility with another dependency (firebase I think).

I was able to correct this behavior by explicitly setting (in app/build.gradle above apply from: "../../node_modules/react-native/react.gradle")

project.ext.react = [
// ...
// where to put the JS bundle asset in release mode
// react.gradle puts this in a merged${flavor}Assets directory by default which RN cannot find
jsBundleDirStagingRelease: "$buildDir/intermediates/assets/stagingRelease",
jsBundleDirProductionRelease: "$buildDir/intermediates/assets/productionRelease",
]

it seems the default behavior in react.gradle was putting the bundle in a directory which got moved into the app bundle in a way that react native could not find.

if you analyze your app bundle / apk and find a similar problem (index.android.bundle) is in a subdirectory below assets, then my solution will hopefully help you!

true-hamid commented 1 month ago

Here's my solution, may or may not work for you:

My index.android.bundle was making it into the app bundle but incorrectly nested in a directory: assets/mergeStagingReleaseAssets/index.android.bundle. I added flavors to my app for staging and production environments and upgraded AGP for compatibility with another dependency (firebase I think).

I was able to correct this behavior by explicitly setting (in app/build.gradle above apply from: "../../node_modules/react-native/react.gradle")
project.ext.react = [
    // ...
    // where to put the JS bundle asset in release mode
    // react.gradle puts this in a merged${flavor}Assets directory by default which RN cannot find
    jsBundleDirStagingRelease: "$buildDir/intermediates/assets/stagingRelease",
    jsBundleDirProductionRelease: "$buildDir/intermediates/assets/productionRelease",
]
it seems the default behavior in react.gradle was putting the bundle in a directory which got moved into the app bundle in a way that react native could not find.

if you analyze your app bundle / apk and find a similar problem (index.android.bundle) is in a subdirectory below assets, then my solution will hopefully help you!

I found this after a long and endless search, which was exactly what I needed. Thank you sir! I believe this fix would is the correct one if you upgraded AGP but not the react native version, which is when the mismatch happens and this behaviour occurs.

antonio-MF commented 6 days ago

Here's my solution, may or may not work for you:

My index.android.bundle was making it into the app bundle but incorrectly nested in a directory: assets/mergeStagingReleaseAssets/index.android.bundle. I added flavors to my app for staging and production environments and upgraded AGP for compatibility with another dependency (firebase I think).

I was able to correct this behavior by explicitly setting (in app/build.gradle above apply from: "../../node_modules/react-native/react.gradle")
project.ext.react = [
    // ...
    // where to put the JS bundle asset in release mode
    // react.gradle puts this in a merged${flavor}Assets directory by default which RN cannot find
    jsBundleDirStagingRelease: "$buildDir/intermediates/assets/stagingRelease",
    jsBundleDirProductionRelease: "$buildDir/intermediates/assets/productionRelease",
]
it seems the default behavior in react.gradle was putting the bundle in a directory which got moved into the app bundle in a way that react native could not find. if you analyze your app bundle / apk and find a similar problem (index.android.bundle) is in a subdirectory below assets, then my solution will hopefully help you!
I found this after a long and endless search, which was exactly what I needed. Thank you sir! I believe this fix would is the correct one if you upgraded AGP but not the react native version, which is when the mismatch happens and this behaviour occurs.

It works in RN67.4 and SDK34.

facebook / react-native