I have a problem with the Drawer in React Native CLI in my web application (drawer works correctly in Android App). I cant run my web app, because of this problem:
WARNING in ./node_modules/@react-navigation/drawer/lib/module/views/legacy/Drawer.js 51:26-40
export 'default'.'Value' (imported as 'Animated') was not found in 'react-native-reanimated' (possible exports: FlatList, Image, ScrollView, Text, View, addWhitelistedNativeProps, addWhitelistedUIProps, createAnimatedComponent)
WARNING in ./node_modules/@react-navigation/drawer/lib/module/views/legacy/Drawer.js 52:25-39
export 'default'.'Value' (imported as 'Animated') was not found in 'react-native-reanimated' (possible exports: FlatList, Image, ScrollView, Text, View, addWhitelistedNativeProps, addWhitelistedUIProps, createAnimatedComponent)
WARNING in ./node_modules/@react-navigation/drawer/lib/module/views/legacy/Drawer.js 369:42-55
export 'default'.'Code' (imported as 'Animated') was not found in 'react-native-reanimated' (possible exports: FlatList, Image, ScrollView, Text, View, addWhitelistedNativeProps, addWhitelistedUIProps, createAnimatedComponent)
WARNING in ./node_modules/@react-navigation/drawer/lib/module/views/legacy/Drawer.js 373:77-90
export 'default'.'Code' (imported as 'Animated') was not found in 'react-native-reanimated' (possible exports: FlatList, Image, ScrollView, Text, View, addWhitelistedNativeProps, addWhitelistedUIProps, createAnimatedComponent)
I've updated my babel.config.js file to:
module.exports = {
presets: ['module:metro-react-native-babel-preset'],
plugins: [
'@babel/plugin-proposal-export-namespace-from',
'react-native-reanimated/plugin',
],
};
I also copied import react-native-gesture-handler; in the top of my entry file (App.tsx).
Package versions:
- "react-native": "^0.72.6",
- "react-native-web": "^0.19.9",
- "@react-navigation/drawer": "^6.6.6",
- "react-native-gesture-handler": "^2.14.0",
- "react-native-reanimated": "^3.6.1",
I tried to use different versions of this modules, but without any results.