小记vue项目Three.引入模型问题

*问题出在路径

• (我两个模型文件,一个.gltf格式的一个.glb格式的, glb格式是我看一个视频教程跟着下载下来的,要把同事给的.gltf格式的集成到现在的vue项目中)

引入报错

然后开始漫无天日的百度… 有的说要把模型文件放到public文件夹下面试了一下发现不行 (T_T) ! , 又有的说一定要放在"static"文件夹底下(?_?)! , static? 新建一个(在哪?–根目录? public? src? assets?算了,都试试吧…)最终发现static放在src目录下可以加载我自己下载的.glb格式的模型,同事给的.gltf格式加载报错…还是不行!!!还是不行!!!还是不行!!!让同事换个.glb格式是不用想了,但这能导入我.gltf格式的也没什么用啊看了一下加载.gltf格式的报错

百度了一下这个错误也没有什么收获

然后我开始怀疑自己了

1. 是我three版本的问题?
2. 是我少引入了什么文件?不!都照着视频教程搞了,确认了好几遍了啥都不少.

是版本问题的概率比较大,搞!..换了几个版本折腾了好久都是一样的,已经生无可恋不想搞了,再百度…翻到一篇文章,瞎猫碰死耗子试一下

loadGltf() {
    let self = this;
    let loader = new GLTFLoader();
    //load一个测试模型路径：public/model/zhuozi2.gltf
    loader.load("/model/zhuozi2.gltf", function(gltf) {
        self.isLoading = false;//关闭载入中效果
        self.mesh = gltf.scene;
        self.mesh.scale.set(0.4, 0.4, 0.4);//设置大小比例
        self.mesh.position.set(0, 0, 0);//设置位置
        self.scene.add(self.mesh); // 将模型引入three、
        self.animate();
        });
    }

删删改改跑一下还是报错,然后想到之前百度有看到说要放在models文件下,于是在public下又建了个models放进去,依然雷打不动的报错,正想删码关网页的时候看到这段代码的第一行注释,再看看他代码的引入路径.诶!试一下,成了!我恭喜发财的.

结论

//放在public文件夹下但是参数中不要加上'/public/...
loader.load( '/models/scene.gltf', gltf=> {
  console.log(gltf)
});