Could not load XBot GLB to android using useLoader GltfLoaderand meshoptmizer

Questions
, , , ,
1

When attempting to load a GLTF model using useLoader and GLTFLoader in a React Three Fiber component, an error occurs preventing the model from rendering.

Error: Could not load 22: Cannot read property 'match' of undefined

am passing the url as an asset path like this

import Path from '../../assets/models/XBot.glb';

export function Xbot({ words, replay, setReplay }) {
    const group = React.useRef();   
    const { scene } = useLoader(GLTFLoader, Path, (loader) => {
        loader.setMeshoptDecoder(MeshoptDecoder);
      });

but when i use useGLTF it works but am sure useGLTF doesnt work with meshoptdecoder and if it does how can one do it.

2

I don’t know how it works in r3f but… here’s my setup for meshopt loading in vanilla:



let initLoaders = (renderer)=>{
    if (glbLoader)
        return;
    glbLoader = new GLTFLoader()
    dracoLoader = new DRACOLoader();
    dracoLoader.setDecoderPath("https://threejs.org/examples/jsm/libs/draco/");
    //'./js/lib/threejs139/examples/js/libs/draco/');
    dracoLoader.preload();
    glbLoader.setDRACOLoader(dracoLoader);
    meshOptLoader = glbLoader;
    //new GLTFLoader()
    meshOptLoader.setMeshoptDecoder(MeshoptDecoder)
    ktx2Loader = new KTX2Loader();
    ktx2Loader.setTranscoderPath("https://threejs.org/examples/jsm/libs/basis/");
    //'./js/lib/threejs139/examples/js/libs/basis/');
    //basis_transcoder.js
    ktx2Loader.detectSupport(renderer);
    meshOptLoader.setKTX2Loader(ktx2Loader);
}