Invariant Violation: Module AppRegistry is not a registered callable module (calling runApplication). A frequent cause of the error is that the

Question

I am using React native and am getting the same error again and again. Tried everything like closing all running node programs, clearing cache and verifying cache like running (npm cache verify, npm start -- --reset-cache etc). But the same error is occuring. The error message is as follows: ** ERROR ReferenceError: Can't find variable: StatusBar** ERROR Invariant Violation: Module AppRegistry is not a registered callable module (calling runApplication). A frequent cause of the error is that the application entry file path is incorrect. This can also happen when the JS bundle is corrupt or there is an early initialization error when loading React Native.

Here is my Index.js and App.js file.

/**
 * @format
 */

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

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

and App.js file:

import React from 'react';
import { PersistGate } from 'redux-persist/integration/react'
import { createBottomTabNavigator } from '@react-navigation/bottom-tabs'
import { createStackNavigator } from '@react-navigation/stack';
import { NavigationContainer } from '@react-navigation/native';
import Ionicons from 'react-native-vector-icons/Ionicons';
import Home from './screens/Home';
import settings from './screens/settings';
import help from './screens/help';
import newTask from './screens/newTask';
import TaskProp from './screens/taskprop';
import firstOpened from './screens/firstopened';
import { Provider } from 'react-redux'
import store , { persistor }from './store/store';

const Tab = createBottomTabNavigator()
const MyStack = createStackNavigator()

export default class App extends React.Component {

  constructor() {
    super()
    this.state = {
      username: '',
    }
  }
  Tab() {
    return (
          <Tab.Navigator
            screenOptions={({ route }) => ({
            tabBarIcon: ({ focused, color, size }) => {
              let iconName;

              if (route.name === 'Home') {
                iconName = focused
                  ? 'ios-home'
                  : 'ios-home-outline';
              } else if (route.name === 'Help and Features') {
                iconName = focused
                ? 'book'
                : 'book-outline';
              } else if (route.name === 'Settings') {
                iconName = focused
                ? 'md-settings'
                : 'md-settings-outline'
              }
              return <Ionicons name={iconName} size={size} color={color} />;
            },
          tabBarOptions={{
            activeTintColor: 'tomato',
            inactiveTintColor: 'gray',
          }}
        >
          <Tab.Screen name="Home" component={Home} />
          <Tab.Screen name="Help and Features" component={help} />
          <Tab.Screen name="Settings" component={settings} />
        </Tab.Navigator>
    );
  }

  render(){
    return (
      <Provider store={store}>
        <PersistGate loading={null} persistor={persistor}>
          <NavigationContainer>
            <MyStack.Navigator screenOptions={{headerShown: false}}>
              <MyStack.Screen name="FirstOpened" component={firstOpened}/>
              <MyStack.Screen name="Tab" component={this.Tab} />
              <MyStack.Screen name="Add New Task" component={newTask} />
              <MyStack.Screen name="New Task" component={TaskProp} />
            </MyStack.Navigator>
          </NavigationContainer>
        </PersistGate>
      </Provider>
    )}
  }

Any Suggestions are very most welcomed

Answer 1

I had to check all the imports and I found that some of them were to files that I had moved. Fixing those fixed my problem.