使用react-three-fiber渲染3D模型时GLTF加载报错求助

这个错误核心是：GLTFLoader能找到scene.gltf文件，但找不到关联的scene.bin缓冲文件，以下是具体排查和解决方法：

1. 检查文件路径与完整性 #

• 核对desktop_pc文件夹位置：如果组件在src/components目录下，desktop_pc要么和组件同目录，要么把路径改成../desktop_pc/scene.gltf（根据实际目录结构调整）
• 打开desktop_pc文件夹，确认里面同时存在scene.gltf和scene.bin，文件名无拼写错误、无遗漏

2. 调整静态资源存放位置（适配React/Vite等框架） #

• 将desktop_pc整个文件夹移到项目public目录下，路径修改为/desktop_pc/scene.gltf（public是框架默认静态资源根目录，加载更稳定）
• 若用Vite，也可放在src/assets下，对应路径写成/src/assets/desktop_pc/scene.gltf

3. 换用@react-three/drei的GLTF组件 #

useGLTF有时会存在路径适配问题，试试更省心的GLTF组件，它会自动处理资源关联：

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

const Computers = () => {
  return (
    <mesh>
        <hemisphereLight intensity={0.15} groundColor="black" />
        <spotLight
          position={[-20, 50, 10]}
          angle={0.12}
          penumbra={1}
          intensity={1}
          castShadow
          shadow-mapSize={1024}
        />
        <pointLight intensity={1} />
        {/* 替换原有的primitive和useGLTF逻辑 */}
        <GLTF src="/desktop_pc/scene.gltf" />
    </mesh>
  )
}

4. 排查模型文件是否损坏 #

如果以上操作无效，可能是模型导出环节出了问题：

• 用Blender重新导出GLTF模型，导出时勾选「嵌入缓冲数据」，将bin内容合并到gltf中，无需单独加载bin文件
• 若要保留分离文件，导出时确保所有相关文件完整导出，再复制到项目中

内容的提问来源于stack exchange，提问作者mohdraazy