[React Native] url.lastIndexOf is not a function (it is undefined)

[Rakha112]

Hey @CodyJasonBennett, I wasn’t sure whether this issue is coming from @react-three/fiber or @react-three/drei. The issue is when I try to load a GLB model using useGLTF with an import from @react-three/drei/native it throws an error like in the screenshot below.

Warning: TypeError: url.lastIndexOf is not a function (it is undefined)

But when I import directly from @react-three/drei, the model loads — however, the texture fails to load, and I get this error message instead.

THREE.GLTFLoader: Couldn't load texture {"_h": 1, "_i": 2, "_j": [Error: Creating blobs from 'ArrayBuffer' and 'ArrayBufferView' are not supported], "_k": null}

Here’s how to reproduce the issue:
1. Clone this repository
2. Install dependencies using yarn
3. Run the app with yarn expo start -c
4. You’ll see the following error:
Warning: TypeError: url.lastIndexOf is not a function (it is undefined)
5. Change the import in components/Character.tsx from @react-three/drei/native to @react-three/drei
6. The model will load, but the texture won’t.
Thank you!

[Rakha112]

With the changes from this PR #3498, importing from @react-three/drei loads the textures correctly

However, when importing from @react-three/drei/native, the error url.lastIndexOf is not a function (it is undefined) still persists

[iyibu]

I confirmed this behavior using the example from https://github.com/CodyJasonBennett/r3f-rn-simple/tree/master with the following package versions:

"dependencies": {
  "@expo/metro-runtime": "~5.0.4",
  "@react-three/drei": "^10.5.1",
  "@react-three/fiber": "^9.2.0",
  "expo": "^53",
  "expo-gl": "~15.1.7",
  "expo-status-bar": "~2.2.3",
  "react": "19.0.0",
  "react-dom": "19.0.0",
  "react-native": "0.79.5",
  "react-native-web": "~0.20.0",
  "three": "^0.167.1"
},
"devDependencies": {
  "@babel/core": "^7.26.0"
}

Additionally, I manually patched the following files under node_modules/@react-three/fiber/native/dist/ by updating the BlobManager import as follows (applied to all builds just in case):

• react-three-fiber-native.cjs.dev.js
• react-three-fiber-native.cjs.prod.js
• react-three-fiber-native.esm.js

const BlobManagerModule = require('react-native/Libraries/Blob/BlobManager.js');
const BlobManager = BlobManagerModule.default ?? BlobManagerModule;

Also, I noticed that if the import:

import { useGLTF } from '@react-three/drei/native'

is changed to:

import { useGLTF } from '@react-three/drei'

(i.e., removing "native"), everything works correctly with Expo Go, Expo SDK 53, and React 19!

In summary:

• If the latest commit on @react-three/fiber/native is published, and
• If the bug in @react-three/drei/native is fixed,

then the following issues will be resolved:

• Texture loading failures
• a.k.a url.lastIndexOf is not a function error
• a.k.a Error: Creating blobs from 'ArrayBuffer' and 'ArrayBufferView' are not supported error

Thank you very much. Best regards.

@CodyJasonBennett @krispya

[krispya]

Hi folks, I am happy to assist with Native but I don't use it myself so I am relying on guidance from @thejustinwalsh and the community. Just to be clear, RN is not well supported and there will certainly be issues, but if we can do something on our side to alleviate some of those issues I will merge those PRs.

It looks like as far as R3F is concerned #3498 fixes this import issue and I'll cut a quick release.

In the meantime I believe setting config.resolver.unstable_enablePackageExports = false in metro.config.js will work around this issue as reported by @iyibu .

[Rakha112]

Hey @krispya, that PR fixes the issue with textures not loading.
Thanks to the PR, textures now load correctly.

However, the issue with importing from @react-three/drei/native still persists url.lastIndexOf is not a function

[thejustinwalsh]

See: pmndrs/drei#2493 (comment)

[Rakha112]

With @react-three/drei version 10.6.1, it is now possible to import from @react-three/drei/native. Once this PR #3498 is also released, this issue should be fully resolved. Thank you very much!

[krispya]

I’ll make the release today!

[krispya]

Okay, a new version has been released! https://github.com/pmndrs/react-three-fiber/releases/tag/v9.3.0

[Rakha112]

With the latest versions of Fiber and Drei, everything works perfectly.
Thank you so much for always supporting React Native 🙌