Require Module "node_modules/@gorhom/animated-tabbar/src/AnimatedTabBar.tsx" Invariant Violation
Hello there! When creating my tabs adding them to the the Bottom Tab Navigator, (code below) I am receiving this error:
import React from "react";
import { createBottomTabNavigator } from "@react-navigation/bottom-tabs";
import AnimatedTabBar from "@gorhom/animated-tabbar";
import ActivityNavigator from "./ActivityNavigator";
import HomeNavigator from "./HomeNavigator";
import colors from "../config/colors";
import Feather from "react-native-vector-icons/Feather";
const tabs = {
Home: {
labelStyle: {
color: colors.primary,
},
icon: {
component: (props) => (
<Feather name="home" size={20} color={colors.primary} {...props} />
),
activeColor: "white",
inactiveColor: colors.primary,
},
background: {
activeColor: colors.primary,
inactiveColor: "white",
},
},
Activity: {
labelStyle: {
color: colors.primary,
},
icon: {
component: (props) => (
<Feather name="home" size={20} color={colors.primary} {...props} />
),
activeColor: "white",
inactiveColor: colors.primary,
},
background: {
activeColor: colors.primary,
inactiveColor: "white",
},
},
};
const Tab = createBottomTabNavigator();
const AppNavigator = () => (
<Tab.Navigator
initialRouteName="Home"
tabBar={(props) => <AnimatedTabBar tabs={tabs} {...props} />}
>
<Tab.Screen name="Home" component={HomeNavigator} />
<Tab.Screen name="Activity" component={ActivityNavigator} />
</Tab.Navigator>
);
export default AppNavigator;
Please let me know if there is any additional information needed to investigate, thank you!
Require Module "node_modules/@gorhom/animated-tabbar/src/AnimatedTabBar.tsx" Invariant Violation
Hello there! When creating my tabs adding them to the the Bottom Tab Navigator, (code below) I am receiving this error:
Environment info
Steps To Reproduce
Expected:
Reproducible sample code
Here is my code:
Please let me know if there is any additional information needed to investigate, thank you!