I followed this tutorial https://medium.com/@ritikjain1272/making-drawer-navigator-and-a-splash-screen-on-your-react-native-app-2fb561ee17f1 And I have been able to work on several Mobile Apps in the past. Which compiled to APK and uploaded to playstore, but this was in the past.
Trying since today and its been very impossible to get it to work as the very usual. I keep getting this Error
Invariant Violation: TurboModuleRegistry.getEnforcing(...): 'NativeReanimated' could not be found. Verify that a module by this name is registered in the native binary.
My code is looking like this for App.js
import {createAppContainer, createSwitchNavigator} from 'react-navigation';
import {createStackNavigator} from 'react-navigation-stack';
import {createDrawerNavigator} from 'react-navigation-drawer';
import Icon from 'react-native-vector-icons/SimpleLineIcons';
import Splash from './src/Splash';
import Login from './src/Login';
import Register from './src/Register';
import Dashboard from './src/Dashboard';
import InstantMessage from './src/InstantMessage';
const LoginNavigator = createStackNavigator({
'Login': {
screen: Login,
navigationOptions: ({navigation}) => ({
headerLeft: () => (
<TouchableOpacity
style={{marginLeft: 20}}
onPress={() => navigation.toggleDrawer()}>
<Icon name="menu" size={12} />
</TouchableOpacity>
),
}),
},
});
const RegisterNavigator = createStackNavigator({
'Register': {
screen: Register,
navigationOptions: ({navigation}) => ({
headerLeft: () => (
<TouchableOpacity
style={{marginLeft: 20}}
onPress={() => navigation.toggleDrawer()}>
<Icon name="menu" size={12} />
</TouchableOpacity>
),
}),
},
});
const DashboardNavigator = createStackNavigator({
'Home': {
screen: Dashboard,
navigationOptions: ({navigation}) => ({
headerLeft: () => (
<TouchableOpacity
style={{marginLeft: 20}}
onPress={() => navigation.toggleDrawer()}>
<Icon name="menu" size={12} />
</TouchableOpacity>
),
}),
},
});
const InstantMessageNavigator = createStackNavigator({
'Instant Message': {
screen: InstantMessage,
navigationOptions: ({navigation}) => ({
headerLeft: () => (
<TouchableOpacity
style={{marginLeft: 20}}
onPress={() => navigation.toggleDrawer()}>
<Icon name="menu" size={12} />
</TouchableOpacity>
),
}),
},
});
const DrawerNavigator = createDrawerNavigator({
Dashboard: {
navigationOptions: {
drawerIcon: (
<Image
source={{uri: 'asset:/icons/megaphone.png'}}
style={{width: 21, height: 21}}
/>
),
drawerLabel: 'Home',
},
screen: DashboardNavigator,
},
InstantMessage: {
navigationOptions: {
drawerIcon: (
<Image
source={{uri: 'asset:/icons/megaphone.png'}}
style={{width: 21, height: 21}}
/>
),
drawerLabel: 'Messages',
},
screen: DashboardNavigator,
},
});
const AppSwitchNavigator = createSwitchNavigator(
{
Splash: {screen: Splash},
Login: {screen: Login},
Drawer: {screen: DrawerNavigator},
},
{
initialRouteName: 'Splash',
},
);
const App = createAppContainer(AppSwitchNavigator);
export default App;
And package.json is looking like this
{
"name": "xxxxxxxxx",
"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-community/masked-view": "^0.1.10",
"@react-native-picker/picker": "^1.9.8",
"react": "16.13.1",
"react-native": "0.63.4",
"react-native-gesture-handler": "^1.9.0",
"react-native-hr": "^1.1.4",
"react-native-hr-component": "^2.0.3",
"react-native-picker-select": "^8.0.4",
"react-native-reanimated": "^1.13.2",
"react-native-safe-area-context": "^3.1.9",
"react-native-screens": "^2.16.1",
"react-native-vector-icons": "^7.1.0",
"react-navigation": "^4.4.3",
"react-navigation-drawer": "^2.6.0",
"react-navigation-stack": "^2.10.2"
},
"devDependencies": {
"@babel/core": "7.12.10",
"@babel/runtime": "7.12.5",
"@react-native-community/eslint-config": "1.1.0",
"babel-jest": "25.5.1",
"eslint": "6.8.0",
"jest": "25.5.4",
"metro-react-native-babel-preset": "0.59.0",
"react-test-renderer": "16.13.1"
},
"jest": {
"preset": "react-native"
}
}
What Can I be possibly doing wrong? I honestly need help. This is a React Native CLI project.
