vue 与 Three.js 结合

一、使用vue-cli 新建vue工程

注意：这里是用vue-cli 2.0建立的工程

创建一个vue2.0项目 ，名称叫做 vue-three-demo，这里一般创建之后，会自动将依赖包安装完成，若未完成，自己在执行一下 npm install即可。

vue init webpack vue-three-demo

二、安装Three.js包依赖

npm install three

三、Three.js在vue中的引入方式

在需要使用Three.js的文件内，如下引用

注意：若需要某些插件，可以从已安装的threejs包中自带的例子文件夹中引入需要的相关threejs插件。

import * as Three from 'three';

import {OrbitControls} from 'three/examples/jsm/controls/OrbitControls.js';
import {Water} from 'three/examples/jsm/objects/Water.js';
import {Sky} from 'three/examples/jsm/objects/Sky.js';
......