pointLight isn't working in react-three/fiber for expo react native

Question

i wanted to work with three js using react native, i am following a tutorial for this purpose. I am stuck at a problem, the point light doest not seem to work i used ambient light too, it works fine and illuminates the objects but that makes the objects look 2D. following is the code. `

import React from 'react';
import { Canvas } from '@react-three/fiber';

export default function App() {
  return (
    <Canvas>
      {/* <ambientLight intensity={5} /> */}
      <pointLight position={[0, 10, -5]} intensity={1} color="#fff" distance={100}/>
      <mesh rotation={[Math.PI / 4, 0, 0]}>
        <sphereGeometry args={[1, 32, 32]} />
        <meshStandardMaterial color={'orange'} />
      </mesh>
    </Canvas>
  );
}

`

following are the dependencies I am using:

"dependencies": {
    "@expo/webpack-config": "^18.1.2",
    "@react-three/fiber": "^8.13.6",
    "expo": "~49.0.7",
    "expo-gl": "~13.0.1",
    "expo-status-bar": "~1.6.0",
    "expo-three": "^7.0.0",
    "react": "18.2.0",
    "react-dom": "18.2.0",
    "react-native": "0.72.3",
    "react-native-web": "~0.19.6",
    "three": "^0.155.0"
  },

help me find the solution for this

i tried to populate the point light with all the values from constructors individually and collectively but the object always remain black.

Answer 1

Play with intensity:

<pointLight color="#fff" intensity={1000} position={[10, 10, 10]} />