VUE 结合THREE 导入FBX模型

2,318 阅读1分钟

1.创建一个vue项目 注入three.js  

npm install three --save

2. 在需要使用的位置引入

import * as THREE from "three/build/three.module";import { OrbitControls } from "three/examples/jsm/controls/OrbitControls";import { FBXLoader } from "three/examples/jsm/loaders/FBXLoader";

在这里使用的官方的fbx文件 SambaDancing.fbx(自行可以在实例中下载下来)

开始按照网上的路径放在static文件夹下面

会报一个不能获取到这个versuion 打断点发现是不能获取到match() 
获取到的是public文件夹下的index.html文件

  let fbxLoader = new FBXLoader();      // console.log("fbxLoader", fbxLoader);      fbxLoader.load(self.modelPath, function (object) {        // console.log("object", object);        self.scene.add(object);      });

加载后不能加载模型


然后修改了查了很多东西说是对node 和es6不是很友好,但这个好像就是路径引入的问题

修改了文件的路径地址

发现这个模型可以加载出来版本报错问题也没有了