React Native: load a GLB with embedded textures

[axeldelafosse]

Hi everyone!

I'm checking out the beta with React Native and I wanted to check if someone was able to load via a remote URL with GLTFLoader. Looks like React Native's FileLoader implementation isn't working correctly. I started to patch it but wanted to check here.

Let me know if you have any feedback! Thanks :)

[CodyJasonBennett]

I did this with r133 but with r134 three swapped over to the fetch API under the hood which react-native's polyfill doesn't implement correctly (no streaming, blob/array buffer support).

Maybe we can create a FileLoader in three-stdlib that could progressively fallback to the old API or just prefer to use loaders' parse methods. I don't want the API to change from web if we can help it though.

[axeldelafosse]

I did this with r133 but with r134 three swapped over to the fetch API under the hood which react-native's polyfill doesn't implement correctly (no streaming, blob/array buffer support).

Good to know, thanks! Just saw that you use r133 in your example app.

Maybe we can create a FileLoader in three-stdlib that could progressively fallback to the old API or just prefer to use loaders' parse methods.

Yeah that's a good idea. Happy to help!

I don't want the API to change from web if we can help it though.

Me neither.

---

Thank you very much for your reactivity and for your work on React Native support. Really appreciate it.

[wiulma]

@axeldelafosse could you please share your sample...I can't get a working sample with beta version...I have issues when try to install dependency. thanks! :-)

[CodyJasonBennett]

@wiulma, I'd see the react-native example in the docs. You'd roll back three to r133 for full compatibility as described here though.

[wiulma]

hi @CodyJasonBennett . thanks for the quick reply. I'm trying to get it working since some hours... I have a conflict in npm install with fiber v8, react native 064 or 0.65 and react@rc. So I'm trying different configurations or versions, but without any luck. I'm pretty sure I'm doing something wrong, but I can't address it. Maybe it's because I started from a bare react native project. and I manually installed expo modules, but in any case the dependency conflict is between react and fiber.
npm WARN ERESOLVE overriding peer dependency npm WARN While resolving: @react-three/fiber@8.0.0-beta-04 npm WARN Found: react@undefined npm WARN node_modules/react npm WARN react@"^18.0.0-rc.0" from the root project npm WARN npm WARN Could not resolve dependency: npm WARN peer react@">=18.0" from @react-three/fiber@8.0.0-beta-04 npm WARN node_modules/@react-three/fiber npm WARN @react-three/fiber@"^8.0.0-beta-04" from the root project npm WARN ERESOLVE overriding peer dependency npm ERR! code ETARGET npm ERR! notarget No matching version found for react@>=18.0. npm ERR! notarget In most cases you or one of your dependencies are requesting npm ERR! notarget a package version that doesn't exist.
this is the last npm error log I got

[CodyJasonBennett]

@wiulma, react 18 isn't released yet so it won't resolve but you can pass --legacy-peer-deps to skip through.

[wiulma]

I had to specify it because react@rc can't be resolved when I launch npm i, and install fails. in any case I tried to skip the error with --force, but it fails again. I'll try with --legacy-peer-deps. thanks.

[dmunozb]

@wiulma use yarn instead of npm
yarn add react@rc

[CodyJasonBennett]

I went and polyfilled loader behavior in #1994 so loaders should behave correctly with and without useLoader. Only loader not covered is THREE.ImageBitmapLoader which doesn't seem useful for native (all other loaders in core or examples extend or use THREE.ImageLoader or THREE.FileLoader.

Will release a beta (or release-candidate at this point, just waiting on React 18), but in the meantime you can try it by pointing R3F to the PR in your package.json:

"@react-three/fiber": "https://pkg.csb.dev/pmndrs/react-three-fiber/commit/61888404/@react-three/fiber"

Leaving this issue open until we roll this out.