Rendering 3d object in react native is not working

Question

I am trying for the first time to render a 3d shoe by following this tutorial : "https://staging.notjust.dev/blog/2023-02-17-3d-animations-in-react-native-with-threejs-nike-app". I installed everything, I can render some cubes very easly but when I try to render, the shoe using OBJLoader I get this error

Error: Could not load 4: undefined

This error is located at:
    in Unknown
    in FiberProvider
    in CanvasWrapper (created by App)
    in App (created by withDevTools(App))
    in withDevTools(App)
    in RCTView (created by View)
    in View (created by AppContainer)
    in RCTView (created by View)
    in View (created by AppContainer)
    in AppContainer
    in main(RootComponent), js engine: hermes
at node_modules\react-native\Libraries\Core\ExceptionsManager.js:null in reportException 
at node_modules\react-native\Libraries\Core\ExceptionsManager.js:null in handleException 
- ... 7 more stack frames from framework internals

Obviously I can't understand why this problem is occuring. I tried to load another model (gltf and using gltfLoader) but it didn't work too.

Here is my code in my shoe.jsx :

import { useLoader } from '@react-three/fiber';
import { OBJLoader } from 'three/examples/jsm/loaders/OBJLoader'


const Shoe = (props) => {

//SHOE 
const obj = useLoader(OBJLoader, require('../assets/threeD/shoe.obj'))
    return (
    <primitive object={obj} scale={10} />
      
  )
}

export default Shoe

And here you can find my App.js :

export default function App() {
  return (
  <Canvas>
    <Suspense fallback={null}>
      <Shoe position={[0, 0, 0]} />
    </Suspense>
  </Canvas>
  );
}

If anyone could help me to solve this problem I would be grateful, or if you could send me a react native project using 3d that works it would me amazing.

Answer 1

Just give up and use reactJs instead of react Native, it's way more easy for 3d stuff