React native web crashes with react-navigation

[mraak]

The problem

How to reproduce

With "react-navigation": "3.0.9"

simply use createStackNavigator, for example like this:

const App = createStackNavigator({
  TheList: { screen: TheList },
  Detail: { screen: Detail },
  initialRouteName: "TheList"
});

Simplified test case: https://codesandbox.io/s/l9vmp6241m

Steps to reproduce:

1. Run the app

Actual behavior
Application crashes with the following error

ModuleNotFoundError
Could not find module in path: 'react-native-web/Libraries/Animated/src/AnimatedEvent' relative to '/node_modules/react-native-gesture-handler/Swipeable.js'

Expected behavior
Application does not crash and a navigator is displayed

Environment (include versions). Did this work in previous versions?

• React Native for Web (version): 0.10.0-alpha.1
• React (version): 16.5.1
• Browser: Chrome

[necolas]

This is an issue for react-navigation and react-native-gesture-handler (reaching into RN internals is not safe). Also the alpha releases are not stable

[mraak]

Thanks for nothing.

[necolas]

There's nothing to fix on this side. React Navigation doesn't even support the stack navigator on web yet. https://reactnavigation.org/docs/en/web-support.html

[gut4]

software-mansion/react-native-gesture-handler#406

[mraak]

React navigation however works for me in a an Expo project. And having RNW without the commonly used navigators is kinda pointless.

[orestis-z]

Check software-mansion/react-native-gesture-handler#406

And add "react-native-gesture-handler": "jaulz/react-native-gesture-handler#fix/web-compatibility" as temporary dependency in package.json till the PR is merged

RNW runs with navigators on my side now

[AbhishekNairOfficial]

@zamponotiropita I tried your method, now I ended up with this error:

/react-native-gesture-handler/DrawerLayout.js: Support for the experimental syntax 'exportDefaultFrom' isn't currently enabled (30:8):

[orestis-z]

@AbhishekNairOfficial that PR is merged in the meantime. Use the npm version