Not work with GestureHandlerRootView on web

[1280103995]

Thanks your template 👏 👏 👏

Describe the bug

1. i run yarn add react-native-reanimated.
2. according to the react-native-gesture-handler installation documentation to use GestureHandlerRootView, then the page is blank on the web.

src/index.js

import 'react-native-gesture-handler';
...

App.tsx

import {GestureHandlerRootView} from 'react-native-gesture-handler';
...

const TabbedApp = () => {
  return (
    <SafeAreaProvider initialMetrics={initialWindowMetrics}>
      <GestureHandlerRootView style={{flex: 1}}>    // add
        <NavigationContainer>
          <TopTabNavigator />
        </NavigationContainer>
      </GestureHandlerRootView>                     // add
    </SafeAreaProvider>
  );
};

To Reproduce
Use default template

Expected behavior
These popular libraries should work fine on the web, no?

[LunatiqueCoder]

Hello @1280103995 . Thank you for trying my template and for raising this issue.

Indeed, these popular libraries should work well in the web. There might also be the case that for the web there would be needed some certain styles to display your view.

Unfortunately, I don't think I will have time until the weekend to have a look at it. If you resolve the issue in the meantime, I would appreciate if you come back here with an answer.

Thank you! 🙏

[LunatiqueCoder]

First fix:

• https://stackoverflow.com/a/70573596/14056591

Second fix:

• https://stackoverflow.com/a/62297869/14056591
• Use with webpack.DefinePlugin dilanx/craco#55 (comment)

Please confirm new version (1.2.7) works for you.

[1280103995]

Thanks, the new version works fine.

[LunatiqueCoder]

Please use v1.2.8.

In v1.2.7, I managed to introduce a small bug.