vite+vue3+threejs实现一个3D模型的展示案例

1.检查npm -v版本和使用对应的vite安装vue3项目

需要安装依赖：npm install

运行：npm run dev

目录结构：

2.threejs官网：

3.安装threejs

4.准备3D模型素材(我这里使用glb格式)和HDR图片，素材网上可以找有免费的。

5.在App.vue中绑定id，挂载，实例化使用

6.在项目中的src目录下创建utils目录，在utils目录下创建Base3d.js脚本

效果展示：手机模型已经加载至场景中，背景是hdr图。

功能展示：用户可以滑动滚轮将模型进行放大缩小，场景360度无死角旋转。