These are my dependencies from package.json
"dependencies": {
"@expo/vector-icons": "^14.0.2",
"@react-navigation/native": "^6.0.2",
"expo": "~51.0.23",
"expo-constants": "~16.0.2",
"expo-font": "~12.0.9",
"expo-linking": "~6.3.1",
"expo-router": "~3.5.19",
"expo-splash-screen": "~0.27.5",
"expo-status-bar": "~1.12.1",
"expo-system-ui": "~3.0.7",
"expo-web-browser": "~13.0.3",
"react": "18.2.0",
"react-dom": "18.2.0",
"react-native": "0.74.3",
"react-native-fs": "^2.20.0",
"react-native-gesture-handler": "~2.16.1",
"react-native-reanimated": "~3.10.1",
"react-native-reanimated-carousel": "^3.5.1",
"react-native-safe-area-context": "4.10.5",
"react-native-screens": "3.31.1",
"react-native-web": "~0.19.10"
},
And I’m using Expo bundlier.
This is my GettingStarted.jsx
import { View, Text } from 'react-native'
import React, { useState } from 'react'
import RNFS from 'react-native-fs'
import Carousel from 'react-native-reanimated-carousel'
export default function GettingStarted() {
const [file, setFile] = useState([]);
const dir = `${RNFS.PicturesDirectoryPath}social/assets/Img`
const imgUrl = async () => {
try {
const exist = await RNFS.exists(dir)
if (exist) {
console.log("Directory Exist", dir);
}
} catch (error) {
console.error('Error reading subdirectory:', error);
}
}
imgUrl()
return (
<View>
<Carousel >
</Carousel>
</View>
)
}
Index.tsx
import { Text, View } from "react-native";
import GettingStarted from '@/app/(auth)/gettingStarted'
export default function Index() {
return (
<View
style={{
flex: 1,
justifyContent: "center",
alignItems: "center",
}}
>
<GettingStarted></GettingStarted>
</View>
);
}