0

I want to use React Navigation 3.x in combination with react-native-web. By going through the "getting started"-steps,

simply importing: 

import { createStackNavigator, createAppContainer } from "react-navigation";

and updating the babel configurations, I end up receiving this error:

./node_modules/@react-navigation/native/node_modules/react-native-gesture-handler/Swipeable.js Module not found: Can't resolve 'react-native/Libraries/Animated/src/AnimatedEvent' in 'D:\react_native\App\app\node_modules@react-navigation\native\node_modules\react-native-gesture-handler'

In my research I found some topics on github which could have a relation to that error: https://github.com/kmagiera/react-native-gesture-handler/pull/406

https://github.com/react-navigation/react-navigation/issues/5632

I already used this "fix" (from the github pull above) as a dependecy: 

"react-native-gesture-handler": "jaulz/react-native-gesture-handler#fix/web-compatibility"

but again a similar error:

./node_modules/@react-navigation/native/node_modules/react-native-gesture-handler/DrawerLayout.js Module not found: Can't resolve 'react-native/Libraries/Animated/src/AnimatedEvent' in 'D:\react_native\App\app\node_modules@react-navigation\native\node_modules\react-native-gesture-handler'

How can I implement a working navigation on the web with react navigation? maybe using other dependecy versions? or should I use react router after all?

Linda Paiste
  • 38,446
  • 6
  • 64
  • 102
Fabchick
  • 1
  • 1

1 Answers1

0

here are some instruction for setting up react-navigation for web apps. https://reactnavigation.org/docs/en/web-support.html

in short:

yarn add @react-navigation/core yarn add @react-navigation/web

then

import { createSwitchNavigator } from "@react-navigation/core"; import { createBrowserApp, Link } from "@react-navigation/web";

finally replace createAppContainer wIth createBrowserApp

Valentin Kantor
  • 1,799
  • 1
  • 23
  • 27