We read every piece of feedback, and take your input very seriously.
To see all available qualifiers, see our documentation.
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Issue: Black Screen, no environments, no lights and no meshes load at all, no explicit error or warnings, but nothing actually loads.
Run on a real IOS device through a dev build; Tried on both expo@51 with the following app config:
plugins: [ "expo-router", [ "expo-build-properties", { ios: { newArchEnabled: true, }, android: { newArchEnabled: true, }, }, ], ],
and on the expo@52 with the
newArchEnabled: true
flag on the root of the config;
package.json on expo@51
{ "dependencies": { "@expo/vector-icons": "^14.0.2", "@react-navigation/native": "^6.0.2", "@react-three/drei": "^9.115.0", "@react-three/fiber": "^8.17.10", "@react-three/postprocessing": "^2.16.3", "expo": "~51.0.28", "expo-build-properties": "~0.12.5", "expo-constants": "~16.0.2", "expo-font": "~12.0.9", "expo-gl": "~14.0.2", "expo-linking": "~6.3.1", "expo-router": "~3.5.23", "expo-splash-screen": "~0.27.5", "expo-status-bar": "~1.12.1", "expo-system-ui": "~3.0.7", "expo-web-browser": "~13.0.3", "nativewind": "^4.1.21", "react-dom": "18.3.1", "react-native": "0.74.5", "react-native-gesture-handler": "~2.16.1", "react-native-reanimated": "~3.10.1", "react-native-safe-area-context": "4.10.5", "react-native-screens": "3.31.1", "react-native-web": "~0.19.10", "react-three-fiber": "^6.0.13" }, }
package.json on expo@52 on a fresh project (not an update of the 51 project)
{ "dependencies": { "@expo/vector-icons": "^14.0.2", "@react-native-async-storage/async-storage": "1.23.1", "@react-navigation/native": "7.0.0-rc.20", "@zenncore/config": "*", "@zenncore/hooks": "*", "@zennui/icons": "*", "@zennui/native": "*", "expo": "~52.0.0-preview.5", "expo-blur": "~14.0.1", "expo-clipboard": "4.8.0", "expo-constants": "~17.0.1", "expo-font": "~13.0.0", "expo-haptics": "~14.0.0", "expo-image": "1.13.0", "expo-linear-gradient": "^14.0.1", "expo-linking": "~7.0.2", "expo-localization": "16.0.0", "expo-location": "18.0.1", "expo-router": "~4.0.0-preview.3", "expo-secure-store": "~14.0.0", "expo-splash-screen": "~0.28.2", "expo-status-bar": "~2.0.0", "expo-symbols": "~0.2.0", "expo-system-ui": "~4.0.1", "expo-task-manager": "12.0.0", "expo-web-browser": "~14.0.0", "nativewind": "4.1.21", "react": "18.3.1", "react-native": "0.76.0", "react-native-circular-progress": "1.4.1", "react-native-gesture-handler": "~2.20.2", "react-native-reanimated": "~3.16.1", "react-native-safe-area-context": "4.11.0", "react-native-screens": "4.0.0-beta.14", "react-native-svg": "15.8.0", "react-native-web": "~0.19.13" }, }
Here is the code:
import { Canvas, useFrame } from "@react-three/fiber"; import { Environment, useGLTF } from "@react-three/drei/native"; import { Suspense } from "react"; import { Bloom, EffectComposer } from "@react-three/postprocessing"; export default () => { return ( <Canvas camera={{ position: [-6, 0, 16], fov: 36 }}> <color attach="background" args={[0xe2f4df]} /> <ambientLight /> <directionalLight intensity={1.1} position={[0.5, 0, 0.866]} /> <directionalLight intensity={0.8} position={[-6, 2, 2]} /> <Suspense> <Environment preset="park" /> <IPhone /> </Suspense> <EffectComposer> <Bloom intensity={1.5} luminanceThreshold={0.9} /> </EffectComposer> </Canvas> ); }; const IPhone = () => { const asset: string = require("../../../assets/models/iphone.glb"); const { scene } = useGLTF(asset); useFrame(() => { scene.rotation.y += 0.01; }); return <primitive object={scene} />; };
This app is part of a turborepo monorepo:
metro.config.js
// Learn more https://docs.expo.io/guides/customizing-metro const { getDefaultConfig } = require("expo/metro-config"); const path = require("node:path"); const { withTurborepoManagedCache, withWorkspace, withSVGTransformer, withNativeWind, with3DAssets composePlugins, } = require("@zenncore/config/native"); const PROJECT_ROOT = __dirname; const WORKSPACE_ROOT = path.resolve(PROJECT_ROOT, "../.."); const withZenncore = composePlugins( (config) => withSVGTransformer(config, WORKSPACE_ROOT), (config) => withNativeWind(config, WORKSPACE_ROOT), (config) => withWorkspace(config, WORKSPACE_ROOT, PROJECT_ROOT), (config) => withTurborepoManagedCache(config, PROJECT_ROOT), (config) => with3DAssets(config) ); /** @type {import('expo/metro-config').MetroConfig} */ const config = getDefaultConfig(PROJECT_ROOT); module.exports = withZenncore(config);
Otherwise works great on the old architecture!
The text was updated successfully, but these errors were encountered:
No branches or pull requests
Issue: Black Screen, no environments, no lights and no meshes load at all, no explicit error or warnings, but nothing actually loads.
Run on a real IOS device through a dev build;
Tried on both expo@51 with the following app config:
and on the expo@52 with the
newArchEnabled: true
flag on the root of the config;
package.json on expo@51
package.json on expo@52 on a fresh project (not an update of the 51 project)
Here is the code:
This app is part of a turborepo monorepo:
metro.config.js
Otherwise works great on the old architecture!
The text was updated successfully, but these errors were encountered: