React Three Fiber加载GLTF生成Model.jsx遇fetch failed错误求助

报错信息（翻译后） #

解析错误
TypeError: fetch请求失败
在Object.fetch (node:internal/deps/undici/undici:11576:11)
在process.processTicksAndRejections (node:internal/process/task_queues:95:5)

排查解决步骤 #

• 确认文件路径准确性

  • 执行npx gltfjsx Fish.gltf时，确保Fish.gltf文件在当前终端的工作目录下，文件名、后缀（是.gltf不是.glb或其他）完全匹配，Linux/macOS环境下注意区分大小写
  • 执行带路径的命令时，public/models/Fish.gltf要对应项目根目录下的真实路径，可通过ls public/models（Mac/Linux）或dir public\models（Windows）验证文件是否存在

• 清理缓存并使用最新版gltfjsx

  • 先清除npx缓存：npx clear-npx-cache
  • 用最新版本重新执行转换命令：npx gltfjsx@latest public/models/Fish.gltf -o "src/components/three/Fish.jsx" -r "public"

• 检查Node.js版本

  • 报错涉及的undici库对Node.js版本有要求，建议升级到16.x及以上的稳定版（比如18或20），避免版本过低导致的fetch实现不兼容问题

• 使用绝对路径指定文件

  • 若相对路径仍有问题，直接用文件的绝对路径执行命令：
    • Windows示例：npx gltfjsx C:\你的项目路径\public\models\Fish.gltf -o "src/components/three/Fish.jsx" -r "public"
    • Mac/Linux示例：npx gltfjsx /用户/你的用户名/项目路径/public/models/Fish.gltf -o "src/components/three/Fish.jsx" -r "public"

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