0

I'm trying to combine react-native, react-navigation-drawer, and typecsript and have this error:

TypeError: null is not an object (evaluating '_ReanimatedModule.default.configureProps')

Searching around, I feel like the problem might be that there's no default route specified. The Documentation says that there should be an initialRoute:

Several options get passed to the underlying router to modify navigation logic:

initialRouteName - The routeName for the initial route.

but the typescript bindings for NavigationDrawerConfig don't include such a field. Is this just a problem with the typescript bindings?

  "dependencies": {
    "@types/jest": "^24.0.18",
    "@types/react-native": "^0.60.15",
    "@types/react-test-renderer": "^16.9.0",
    "react": "16.9.0",
    "react-native": "0.61.0",
    "react-native-gesture-handler": "^1.4.1",
    "react-native-navigation": "^2.27.9",
    "react-native-reanimated": "^1.2.0",
    "react-navigation": "^4.0.9",
    "react-navigation-drawer": "^2.2.2",
    "react-navigation-stack": "^1.9.0",
    "typescript": "^3.6.3"
  },

I really haven't done much from the default typescript template:

const RouteConfigs: NavigationRouteConfigMap<NavigationDrawerOptions, NavigationDrawerProp<NavigationRoute>> = {
    'home': HomeScreen,
    'profile': ProfileScreen
}

const DrawerNavigatorConfig: NavigationDrawerConfig = {
    drawerWidth: 100,
    drawerPosition: "left"

}

const menu = createDrawerNavigator(RouteConfigs, DrawerNavigatorConfig);

const App = () => {
    return (
        <>
            <StatusBar barStyle="dark-content">OMG</StatusBar>
            <SafeAreaView>
                <Text>Hello, World</Text>
                <Button title="open" onPress={() => {
                    menu.dispatch(DrawerActions.toggleDrawer())
                }}/>
                <Text>Did you see the Button?</Text>
            </SafeAreaView>
            <menu ref={menu}/>
        </>
    );
};
wz2b
  • 1,017
  • 7
  • 24

1 Answers1

0

Probably it is the problem of linking, it is happening so often after 0.6 autolinking update of React-Native!.

Go to your MainApplication.java file and add this line of code "import com.swmansion.reanimated.ReanimatedPackage;"

it will import the missing package and everything will be working . it is supposed to do this automatically (by autolinking) but for some reasons it does not import package so do it manually!.

Happened with me today on 0.61.4 solved by importing it as described here!.

Kashan Haider
  • 1,036
  • 1
  • 13
  • 23