Error following React Native setup guide
miamiappmachine opened this issue · 3 comments
Hi,
When following the setup guide for React Native here: https://docs.pmnd.rs/react-three-fiber/getting-started/installation
The following error occurs, running inside Expo Go on iOS:
While trying to resolve module
its-fine
from file /Users/admin/React Native/three/node_modules/@react-three/fiber/native/dist/react-three-fiber-native.cjs.prod.js
, the package /Users/admin/React Native/three/node_modules/its-fine/package.json
was successfully found. However, this package itself specifies a main
module field that could not be resolved (/Users/admin/React Native/three/node_modules/its-fine/dist/index.cjs
. Indeed, none of these files exist:
- /Users/admin/React Native/three/node_modules/its-fine/dist/index.cjs(.native|.ios.ts|.native.ts|.ts|.ios.tsx|.native.tsx|.tsx|.ios.js|.native.js|.js|.ios.jsx|.native.jsx|.jsx|.ios.json|.native.json|.json)
/Users/admin/React Native/three/node_modules/its-fine/dist/index.cjs/index(.native|.ios.ts|.native.ts|.ts|.ios.tsx|.native.tsx|.tsx|.ios.js|.native.js|.js|.ios.jsx|.native.jsx|.jsx|.ios.json|.native.json|.json)
Dependencies
"dependencies": {
"@react-three/fiber": "^8.8.6",
"expo": "~46.0.13",
"expo-gl": "~11.4.0",
"expo-status-bar": "~1.4.0",
"react": "18.0.0",
"react-native": "0.69.6",
"three": "^0.144.0"
},
"devDependencies": {
"@babel/core": "^7.12.9"
},
Did you configure Metro as per the installation instructions?
I hadn't, but I've just configured it as suggested now and it works!
I didn't perform the step due to the disclaimer on it:
Some configuration may be required to tell the Metro bundler about your assets if you use useLoader or Drei abstractions like useGLTF and useTexture:
Since this was just a simple test that wasn't using these things to start (and I've read that metro config may need to be edited again down the line to ensure consistency across different platform builds) I omitted it. Maybe it would be good to remove the disclaimer and make it a mandatory step going forwards?
Either way it looks like everything is working now, thanks so much for your help!
I see, it wasn't intended for R3F to require additional configuration to run, so I'll add a react-native
key here as a work-around so Metro can work OOTB.