本篇文章主要针对小白在使用threejs中所遇到的问题,因为我就是小白,接下来会和大家一起慢慢成长。
推荐几个学习的地址:
TRHEE.js中文网
TRHEE.js 哔哩哔哩学习视频
TRHEE.js 官方地址
TRHEE.js GitHub地址
在.html 文件中主要是通过引用threejs(点击下载three.js),若是想使用 OrbitControls,GLTFLoader这些,可以单独到 threejs GitHub上进行下载并引入
也可以直接引用下面这个地址
其它相关资源的引用可去这里进行对应的引用,点我查看
下面主要介绍 vue 在引入 threejs 中遇到的问题:
1.组件怎么引用,这里的 OrbitControls 这些不能直接引入,需要进行一些操作后才能引入 点击查看如何引入。
因为我用的是 vue-cli3.0,所以需要创建一个 vue.config.js,引入后就不会报错了 。<点击查看 vue.config.js的相关配置>
vue.config.js 配置
const ThreeExamples = require('import-three-examples')
// 第三方插件配置
pluginOptions: {
// ...
...ThreeExamples
}
首先 npm install --s three
组件内引用
import * as THREE from "three";
代码如下: