React native Question posted in
The official React Native documentation can be found here.

React native – App instant crash after loading: A module failed to load due to an error

I’m not sure because the project haven’t been touched in months but it seems that the problem did appear after I upgraded MacOS to Sonoma. I am on an Intel Mac.

A fully working app doesn’t run at all and instantly crash at start with the following error message:

iOS Bundled 411ms (index.js)
 LOG  Running "" with {"rootTag":21,"initialProps":{}}
 ERROR  Invariant Violation: "" has not been registered. This can happen if:
* Metro (the local dev server) is run from the wrong folder. Check if Metro is running, stop it and restart it in the current project.
* A module failed to load due to an error and `AppRegistry.registerComponent` wasn't called.

So I updated all my npm packages/reinstalled the pods, I now have:

"scripts": {
    "start": "expo start --dev-client",
    "android": "expo run:android",
    "ios": "npx expo run:ios",
    "web": "expo start --web",
    "build:ios": "eas build -p ios",
    "build:android": "eas build -p android",
    "build:all": "eas build -p all",
    "publish:ios": "eas submit -p ios",
    "publish:android": "eas submit -p android"
  },
  "dependencies": {
    "@react-native-async-storage/async-storage": "^1.22.3",
    "@react-navigation/bottom-tabs": "^6.5.0",
    "@react-navigation/native": "^6.0.13",
    "@react-navigation/native-stack": "^6.9.1",
    "expo": "^50.0.8",
    "expo-clipboard": "^5.0.1",
    "expo-dev-client": "^3.3.9",
    "expo-font": "^11.10.3",
    "expo-image-picker": "^14.7.1",
    "expo-linear-gradient": "^12.7.2",
    "expo-splash-screen": "^0.26.4",
    "expo-status-bar": "^1.11.1",
    "react": "^18.2.0",
    "react-native": "^0.73.5",
    "react-native-animatable": "^1.3.3",
    "react-native-google-mobile-ads": "^13.0.2",
    "react-native-onesignal": "^5.0.6",
    "react-native-safe-area-context": "^4.9.0",
    "react-native-screens": "^3.29.0",
    "react-native-sound": "^0.11.2",
    "socket.io-client": "^4.5.4"
  },
  "devDependencies": {
    "@babel/core": "^7.19.3"
  },

But the app still fails running. So I replaced my index.js by the following content (just to try if my App.js could be the problem):

import { registerRootComponent } from 'expo';
import { View } from 'react-native';

function App() {
  return <View />;
}
// Utilisation de registerRootComponent pour les applications Expo
registerRootComponent(App);

I have in my app.json:

{
  "expo": {
    "name": "AppName",
    "displayName": "AppName",[...]

I also tried using AppRegistry directly but I still have the same error message. And the moduleName is set to @"main" in my AppDelegate.mm

Tags:

2

Answers


  1. 0

    At first I’ll suggest to close everything and load it again.
    Next, change your index.js to be

    import {AppRegistry} from 'react-native';
import App from './App';
import {name as appName} from './app.json';

AppRegistry.registerComponent(appName, () => App);

    After that change the App.js back to what it was and try to run it again.

    btw, when you run the app for the first time without changes does it run ? and what the react native version that you have?

    Login or Signup to reply.
  2. 0

    • The significant changes introduced in React Native 0.64.0. In this version, the AppRegistry module has been removed and replaced with AppRegistry.registerComponent.

    • In your index.js file, you’re using registerRootComponent from ‘expo’. This method is no longer available in the latest version of Expo. You need to use AppRegistry.registerComponent instead.

    You can modify your index.js file

      import { registerComponent } from 
  'expo/build/launch/registerRootComponent';
  import App from './App';

  //RegisterComponent Utilisation for Expo Applications
  registerComponent(App);

    Or, if you prefer to use AppRegistry.registerComponent directly

    import { AppRegistry } from 'react-native';
import App from './App';

//RegisterComponent Utilisation for Expo Applications
AppRegistry.registerComponent('AppName', () => App);
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search