react-native-gesture-handler 2.0+ / React Native 0.60+ ?

Thanks for the quick reply! I assume that means it should work. Unfortunately for me, it's not working.

On a fresh Ubuntu 20.04 I have run:

npm install -g n
sudo n stable

npm install -g expo-cli
expo init sample-app
cd sample-app

# I use npm install here instead of expo install since your docs make no mention of expo, but I've tried expo install with no luck too
npm install react-native-reanimated-carousel 
expo install react-native-gesture-handler
expo install react-native-reanimated

Results in a package.json like:

{
  "name": "sample-app",
  "version": "1.0.0",
  "main": "index.js",
  "scripts": {
    "start": "expo start --dev-client",
    "android": "expo run:android",
    "ios": "expo run:ios",
    "web": "expo start --web"
  },
  "dependencies": {
    "expo": "~44.0.2",
    "expo-splash-screen": "~0.14.1",
    "expo-status-bar": "~1.2.0",
    "react": "17.0.1",
    "react-dom": "17.0.1",
    "react-native": "0.64.3",
    "react-native-reanimated-carousel": "^2.2.4",
    "react-native-web": "0.17.1",
    "react-native-gesture-handler": "~2.1.0",
    "react-native-reanimated": "~2.3.1"
  },
  "devDependencies": {
    "@babel/core": "^7.12.9"
  },
  "private": true
}

with an App.js like:

import React from 'react';
import { StatusBar } from 'expo-status-bar';

import Carousel from 'react-native-reanimated-carousel';

export default function App() {
  return (
    <View>
        <StatusBar style="auto" />
        <Carousel
            width={300}
            height={150}
            data={[1, 2, 3]}
            renderItem={({ item }) => <div />}
        />
    </View>
  );
}

And that results in an error like this during an npm run web:

Web Bundling complete 9783ms
./node_modules/react-native-gesture-handler/lib/module/index.js:73
"export 'ComposedGestureType' (reexported as 'ComposedGesture') was not found in './handlers/gestures/gestureComposition'
  71 | export { NativeGestureType as NativeGesture } from './handlers/gestures/nativeGesture';
  72 | export { ManualGestureType as ManualGesture } from './handlers/gestures/manualGesture';
> 73 | export {
  74 |   ComposedGestureType as ComposedGesture,
  75 |   RaceGestureType as RaceGesture,
  76 |   SimultaneousGestureType as SimultaneousGesture,
./node_modules/react-native-gesture-handler/lib/module/index.js:73
"export 'ExclusiveGestureType' (reexported as 'ExclusiveGesture') was not found in './handlers/gestures/gestureComposition'
  71 | export { NativeGestureType as NativeGesture } from './handlers/gestures/nativeGesture';
  72 | export { ManualGestureType as ManualGesture } from './handlers/gestures/manualGesture';
> 73 | export {
  74 |   ComposedGestureType as ComposedGesture,
  75 |   RaceGestureType as RaceGesture,
  76 |   SimultaneousGestureType as SimultaneousGesture,
./node_modules/react-native-gesture-handler/lib/module/index.js:66
"export 'FlingGestureType' (reexported as 'FlingGesture') was not found in './handlers/gestures/flingGesture'
  64 | export { TapGestureType as TapGesture } from './handlers/gestures/tapGesture';
  65 | export { PanGestureType as PanGesture } from './handlers/gestures/panGesture';
> 66 | export { FlingGestureType as FlingGesture } from './handlers/gestures/flingGesture';
  67 | export { LongPressGestureType as LongPressGesture } from './handlers/gestures/longPressGesture';
  68 | export { PinchGestureType as PinchGesture } from './handlers/gestures/pinchGesture';
  69 | export { RotationGestureType as RotationGesture } from './handlers/gestures/rotationGesture';
./node_modules/react-native-gesture-handler/lib/module/index.js:70
"export 'ForceTouchGestureType' (reexported as 'ForceTouchGesture') was not found in './handlers/gestures/forceTouchGesture'
  68 | export { PinchGestureType as PinchGesture } from './handlers/gestures/pinchGesture';
  69 | export { RotationGestureType as RotationGesture } from './handlers/gestures/rotationGesture';
> 70 | export { ForceTouchGestureType as ForceTouchGesture } from './handlers/gestures/forceTouchGesture';
  71 | export { NativeGestureType as NativeGesture } from './handlers/gestures/nativeGesture';
  72 | export { ManualGestureType as ManualGesture } from './handlers/gestures/manualGesture';
  73 | export {
./node_modules/react-native-gesture-handler/lib/module/index.js:79
"export 'GestureStateManagerType' (reexported as 'GestureStateManager') was not found in './handlers/gestures/gestureStateManager'
  77 |   ExclusiveGestureType as ExclusiveGesture,
  78 | } from './handlers/gestures/gestureComposition';
> 79 | export { GestureStateManagerType as GestureStateManager } from './handlers/gestures/gestureStateManager';
  80 | export { NativeViewGestureHandler } from './handlers/NativeViewGestureHandler';
  81 | export type {
  82 |   RawButtonProps,
./node_modules/react-native-gesture-handler/lib/module/index.js:67
"export 'LongPressGestureType' (reexported as 'LongPressGesture') was not found in './handlers/gestures/longPressGesture'
  65 | export { PanGestureType as PanGesture } from './handlers/gestures/panGesture';
  66 | export { FlingGestureType as FlingGesture } from './handlers/gestures/flingGesture';
> 67 | export { LongPressGestureType as LongPressGesture } from './handlers/gestures/longPressGesture';
  68 | export { PinchGestureType as PinchGesture } from './handlers/gestures/pinchGesture';
  69 | export { RotationGestureType as RotationGesture } from './handlers/gestures/rotationGesture';
  70 | export { ForceTouchGestureType as ForceTouchGesture } from './handlers/gestures/forceTouchGesture';
./node_modules/react-native-gesture-handler/lib/module/index.js:72
"export 'ManualGestureType' (reexported as 'ManualGesture') was not found in './handlers/gestures/manualGesture'
  70 | export { ForceTouchGestureType as ForceTouchGesture } from './handlers/gestures/forceTouchGesture';
  71 | export { NativeGestureType as NativeGesture } from './handlers/gestures/nativeGesture';
> 72 | export { ManualGestureType as ManualGesture } from './handlers/gestures/manualGesture';
  73 | export {
  74 |   ComposedGestureType as ComposedGesture,
  75 |   RaceGestureType as RaceGesture,
./node_modules/react-native-gesture-handler/lib/module/index.js:71
"export 'NativeGestureType' (reexported as 'NativeGesture') was not found in './handlers/gestures/nativeGesture'
  69 | export { RotationGestureType as RotationGesture } from './handlers/gestures/rotationGesture';
  70 | export { ForceTouchGestureType as ForceTouchGesture } from './handlers/gestures/forceTouchGesture';
> 71 | export { NativeGestureType as NativeGesture } from './handlers/gestures/nativeGesture';
  72 | export { ManualGestureType as ManualGesture } from './handlers/gestures/manualGesture';
  73 | export {
  74 |   ComposedGestureType as ComposedGesture,
./node_modules/react-native-gesture-handler/lib/module/index.js:65
"export 'PanGestureType' (reexported as 'PanGesture') was not found in './handlers/gestures/panGesture'
  63 | export { GestureObjects as Gesture } from './handlers/gestures/gestureObjects';
  64 | export { TapGestureType as TapGesture } from './handlers/gestures/tapGesture';
> 65 | export { PanGestureType as PanGesture } from './handlers/gestures/panGesture';
  66 | export { FlingGestureType as FlingGesture } from './handlers/gestures/flingGesture';
  67 | export { LongPressGestureType as LongPressGesture } from './handlers/gestures/longPressGesture';
  68 | export { PinchGestureType as PinchGesture } from './handlers/gestures/pinchGesture';
./node_modules/react-native-gesture-handler/lib/module/index.js:68
"export 'PinchGestureType' (reexported as 'PinchGesture') was not found in './handlers/gestures/pinchGesture'
  66 | export { FlingGestureType as FlingGesture } from './handlers/gestures/flingGesture';
  67 | export { LongPressGestureType as LongPressGesture } from './handlers/gestures/longPressGesture';
> 68 | export { PinchGestureType as PinchGesture } from './handlers/gestures/pinchGesture';
  69 | export { RotationGestureType as RotationGesture } from './handlers/gestures/rotationGesture';
  70 | export { ForceTouchGestureType as ForceTouchGesture } from './handlers/gestures/forceTouchGesture';
  71 | export { NativeGestureType as NativeGesture } from './handlers/gestures/nativeGesture';
./node_modules/react-native-gesture-handler/lib/module/index.js:73
"export 'RaceGestureType' (reexported as 'RaceGesture') was not found in './handlers/gestures/gestureComposition'
  71 | export { NativeGestureType as NativeGesture } from './handlers/gestures/nativeGesture';
  72 | export { ManualGestureType as ManualGesture } from './handlers/gestures/manualGesture';
> 73 | export {
  74 |   ComposedGestureType as ComposedGesture,
  75 |   RaceGestureType as RaceGesture,
  76 |   SimultaneousGestureType as SimultaneousGesture,
./node_modules/react-native-gesture-handler/lib/module/index.js:69
"export 'RotationGestureType' (reexported as 'RotationGesture') was not found in './handlers/gestures/rotationGesture'
  67 | export { LongPressGestureType as LongPressGesture } from './handlers/gestures/longPressGesture';
  68 | export { PinchGestureType as PinchGesture } from './handlers/gestures/pinchGesture';
> 69 | export { RotationGestureType as RotationGesture } from './handlers/gestures/rotationGesture';
  70 | export { ForceTouchGestureType as ForceTouchGesture } from './handlers/gestures/forceTouchGesture';
  71 | export { NativeGestureType as NativeGesture } from './handlers/gestures/nativeGesture';
  72 | export { ManualGestureType as ManualGesture } from './handlers/gestures/manualGesture';
./node_modules/react-native-gesture-handler/lib/module/index.js:73
"export 'SimultaneousGestureType' (reexported as 'SimultaneousGesture') was not found in './handlers/gestures/gestureComposition'
  71 | export { NativeGestureType as NativeGesture } from './handlers/gestures/nativeGesture';
  72 | export { ManualGestureType as ManualGesture } from './handlers/gestures/manualGesture';
> 73 | export {
  74 |   ComposedGestureType as ComposedGesture,
  75 |   RaceGestureType as RaceGesture,
  76 |   SimultaneousGestureType as SimultaneousGesture,
./node_modules/react-native-gesture-handler/lib/module/index.js:64
"export 'TapGestureType' (reexported as 'TapGesture') was not found in './handlers/gestures/tapGesture'
  62 | export { GestureDetector } from './handlers/gestures/GestureDetector';
  63 | export { GestureObjects as Gesture } from './handlers/gestures/gestureObjects';
> 64 | export { TapGestureType as TapGesture } from './handlers/gestures/tapGesture';
  65 | export { PanGestureType as PanGesture } from './handlers/gestures/panGesture';
  66 | export { FlingGestureType as FlingGesture } from './handlers/gestures/flingGesture';
  67 | export { LongPressGestureType as LongPressGesture } from './handlers/gestures/longPressGesture';

I've tried it with and without wrapping everything in App.js in <GestureHandlerRootView> but I get the same error.

When looking at the example, react-native-gesture-handler is at ~1.10.2. I suspect this is the problem as it looks to me like version 2.0.0 of this library contained breaking changes. If I change that to 1.10.3 (or 1.10.2) it still doesn't work but I get fewer errors and I get a warning like:

Some dependencies are incompatible with the installed expo package version:
 - react-native-gesture-handler - expected version: ~2.1.0 - actual version installed: 1.10.3
Your project may not work correctly until you install the correct versions of the packages.

According to the docs:

The Expo SDK incorporates the latest version of react-native-gesture-handler available at the time of each SDK release, so managed Expo apps might not always support all our latest features as soon as they are available.

So I don't think we really get to choose the version of that library with expo but I am extremely new to react native/expo.

If it would help, I can probably get a docker image that reproduces the issue later today.

dohooo / react-native-reanimated-carousel

react-native-gesture-handler 2.0+ / React Native 0.60+ ? #126