I get error " ERROR TypeError: Cannot read property 'createNode' of null, js engine: hermes" and " Invariant Violation: "main" has not been registered."

[sc0rp10n-py]

The steps I have used npm install react-native-reanimated-carousel then installed npm install react-native-gesture-handler and npx expo install react-native-reanimated then I edited my App.js to add GestureHandlerRootView

const Stack = createNativeStackNavigator();
const App = () => {
    return (
        <GestureHandlerRootView style={{ flex: 1 }}>
            <NativeBaseProvider>
                <NavigationContainer>
                ...
                </NavigationContainer>
            </NativeBaseProvider>
        </GestureHandlerRootView>
    );
};

export default App;

then I edited my babel.config.js

module.exports = function (api) {
    api.cache(true);
    return {
        plugins: [
            "nativewind/babel",
            "@babel/plugin-proposal-export-namespace-from",
            ["react-native-reanimated/plugin", {
                "relativeSourceLocation": true,
            }],
        ],
        presets: ["babel-preset-expo"],
    };
};

then I made a carousel component like this

const BuyerCarousel = () => {
    const width = Dimensions.get("window").width;
    return (
        <>
            <View style={{ flex: 1 }}>
                <Carousel
                    loop
                    width={width}
                    height={width / 2}
                    autoPlay={true}
                    data={[...new Array(6).keys()]}
                    scrollAnimationDuration={1000}
                    onSnapToItem={(index) =>
                        console.log("current index:", index)
                    }
                    renderItem={({ index }) => (
                        <View
                            style={{
                                flex: 1,
                                borderWidth: 1,
                                justifyContent: "center",
                            }}
                        >
                            <Text style={{ textAlign: "center", fontSize: 30 }}>
                                {index}
                            </Text>
                        </View>
                    )}
                />
            </View>
        </>
    );
};

export default BuyerCarousel;

In my console I got this error when I ran npx expo start --dev-client and then opened it in android device

 ERROR  TypeError: Cannot read property 'createNode' of null, js engine: hermes
 ERROR  Invariant Violation: "main" has not been registered. This can happen if:
* Metro (the local dev server) is run from the wrong folder. Check if Metro is running, stop it and restart it in the current project.
* A module failed to load due to an error and `AppRegistry.registerComponent` wasn't called., js engine: hermes

[kongarasan]

Hey did you find an answer