Javascript 三个JS xhr无穷大已加载%

我目前正在与ThreeJS合作，我承认我是一个新手。我可以在其中创建自己的模型（基本模型），但在加载外部gltf文件时遇到问题。我在一个React项目中使用这个

我加载模型的代码如下：

componentDidMount() {
  let scene = new THREE.Scene();
  scene.background = new THREE.Color(0xdddddd);
  let camera = new THREE.PerspectiveCamera(
    45,
    window.innerWidth / window.innerHeight,
    1,
    500
  );
  camera.position.set(1, 1, 20);

  let renderer = new THREE.WebGLRenderer({ alpha: false });
  renderer.setSize(500, 500);
  document.getElementById("three-canvas").appendChild(renderer.domElement);
  // Load Light
  let ambientLight = new THREE.AmbientLight(0xcccccc);
  scene.add(ambientLight);

  let directionalLight = new THREE.DirectionalLight(0xffffff);
  directionalLight.position.set(0, 1, 1).normalize();
  scene.add(directionalLight);

  camera.position.z = 5;
  camera.lookAt(new THREE.Vector3(0, 0, 0));

  let loader = new GLTFLoader();
  loader.load(
    "./assets/scene.gltf",
    (gltf) => {
      scene.add(gltf.scene);
    },
    // called while loading is progressing
    function (xhr) {
      console.log((xhr.loaded / xhr.total) * 100 + "% loaded");
      console.log(xhr.loaded, xhr.total);
      console.log(xhr);
    },
    // called when loading has errors
    function (error) {
      console.log("An error happened", error);
    }
  );
  let animate = function () {
    requestAnimationFrame(animate);
    render();
  };
  function render() {
    renderer.render(scene, camera);
  }
  animate();
}

render() {
  return (
    <div className="App">
        <div id="three-canvas"></div>
    </div>
  );
}

我还得到：

164814 0

对应于：

console.log(xhr.loaded, xhr.total);

这告诉我总数是0，但我不确定这意味着什么

我会注意到，如果我将我的gltf文件切换到公共目录，则会发生一个全新的错误，在控制台中我会得到以下信息：

An error happened SyntaxError: Unexpected token < in JSON at position 0
    at JSON.parse (<anonymous>)
    at GLTFLoader.parse (GLTFLoader.js:214)
    at Object.onLoad (GLTFLoader.js:146)
    at XMLHttpRequest.<anonymous> (three.module.js:36370)

在位置0的JSON中发生错误SyntaxError:Unexpected token<
在JSON.parse(

有些东西告诉我，要么：
1） 我的灯光可能已关闭，因此无法正确显示图片
2） 文件加载不正确，因此
xhr.total的值为0

任何帮助都将不胜感激。谢谢大家!

An error happened SyntaxError: Unexpected token < in JSON at position 0
    at JSON.parse (<anonymous>)
    at GLTFLoader.parse (GLTFLoader.js:214)
    at Object.onLoad (GLTFLoader.js:146)
    at XMLHttpRequest.<anonymous> (three.module.js:36370)