three.js DRACOLoader glb模型加载错误 three Unexpected token ＜ in JSON at position 0

前言

所采用的three库版本为 ^0.138.2

本文所记录的是笔者在使用pacel-web打包工具学习three.js时遇到的一个模型加载问题，在导入模型的时候浏览器识别不出模型文件（以.glb为例）以及Draco库。

解决方案与介绍

项目结构如下

首先把three/examples/js/libs/目录下的draco复制一份到dist目录下

然后在dist目录下创建模型存储文件model（具体如下图）

最后用代码导入模型

部分代码

const loader = new GLTFLoader();
const dracoLoader = new DRACOLoader();
dracoLoader.setDecoderPath("path");
dracoLoader.setDecoderConfig({ type: "js" });
loader.setDRACOLoader(dracoLoader);
loader.load("./model/hyl.glb", (gltf) => {const hyl = gltf.scene;scene.add(hyl);
});

这样就能导入模型了，代码没写注释，threee.js官方文档里面有关于导入模型的注释，这个加载错误很常见，具体的原因我去google了，大概的意思是就是没有识别到路径。感兴趣的可以去看看官方文档。

注：在vue中draco和model应该放在静态目录下，方法与上面的类似，笔者是放在public目录下的。

three.js DRACOLoader glb模型加载错误 three Unexpected token ＜ in JSON at position 0相关推荐

Three.js Vue 如何加载字体，和遇到问题解决：中加载字体的问题 Uncaught SyntaxError: Unexpected token = in JSON at position 0
Three.js Vue 中加载字体的问题 Uncaught SyntaxError: Unexpected token = in JSON at position 0 一.转换字体文件到 json ...
微信小程序 Unexpected token in JSON at position 0 设置二维码，并且使用js中JSON.parse()函数将二维码返回的值转化为json格式
代码报错: Unexpected token in JSON at position 0 使用二维码生成器, JSON.parse()函数 1.可以随便在网上找一个生成二维码的网站本人用的是这个二 ...
js常见报错之Unexpected token in JSON at position
js常见报错之Unexpected token ] in JSON at position 结合他人出错总结,出现这个报错提示,根本原因只有一个json解析异常,所以json的返回数据注意检查其返回内 ...
js Uncaught SyntaxError: Unexpected token , in JSON at position xxx at JSON.parse问题解决
问题描述: Uncaught SyntaxError: Unexpected token , in JSON at position 4100 at JSON.parse JSON.Parse()方法 ...
tensorflow keras模型加载错误
加载resnet101模型报错 mynet = tf.keras.applications.ResNet101(include_top=False, weights="imagenet&qu ...
JS报错解决：SyntaxError: Unexpected token 《 in JSON at position 0
ThinkPHP5.1的环境要求如下: PHP >= 5.6.0 PDO PHP Extension MBstring PHP Extension 最近下载了tp 5.1.19来玩,造轮子难免会 ...
浅谈DirectX的模型加载
浅谈DirectX的模型加载 xanxus - 2010年10月3日 - DirectX - 0 Comments 喜欢这篇文章吗?分享给你的朋友吧~ 基于DirectX的游戏开发中,人物和模型由针 ...
Three.js 模型加载及加载简单动画
时间过的好快啊~再一次感叹,忙忙碌碌一年又过去了,新年第一帖,新的一年也要加油呀! 简单介绍下Three.js吧,Three.js是基于原生WebGL封装运行的三维引擎,在所有WebGL引擎中,Thr ...
JS重启自动运行加载视频错误
JS重启自动运行加载视频错误问题原因结论问题各种浏览器调试运行都没问题,系统启动自动运行Chrome加载网页就会出现页面错位错误原因调试发现两个层之间的视频加载错误了结论也就是说系 ...

three.js DRACOLoader glb模型加载错误 three Unexpected token ＜ in JSON at position 0

前言

解决方案与介绍

three.js DRACOLoader glb模型加载错误 three Unexpected token ＜ in JSON at position 0相关推荐

最新文章

热门文章