一、创建VUE项目工程
1、方法一
使用下面命令行快速创建vue项目，Please pick a preset这里我们选择使用VUE3
vue create projectName
创建时可能会遇到的报错
错误原因：当前使用的node版本未全局安装vue-cli脚手架，使用下面命令安装后再使用创建命令行vue create就可
npm install -g @vue/cli创建完成后进入项目根目录，执行npm run serve，如下即项目运行成功。
2、方法二
使用npm create vue@latest 创建项目
安装依赖并启动
cd mythreejsvue3
npm install
npm run dev
浏览器输入地址：http://localhost:5173/页面预览如下
二、安装Element-Plus并引入
1、安装
npm install element-plus
2、引入
main.js
3、自动导入
npm install -D unplugin-vue-components unplugin-auto-import
4、配置vite.config.js
5、npm run dev启动项目
6、创建导航、页面及关联路由
三、安装使用three.js
1、下载安装
npm install three
npm安装特定版本three.js(注意使用哪个版本，查文档就查对应版本)
// 比如安装148版本
npm install three@0.148.02、使用
npm安装three后，执行下面即引入three.js
import * as THREE from 'three';其他扩展库引入方法
// 引入扩展库OrbitControls.js
import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls.js';
// 引入扩展库GLTFLoader.js
import { GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader.js';3、开始创建一个3D场景
创建一个3D基础场景
<template><div class="box" ref="box"></div>
</template>
效果如下图：
到此一个完整的VUE3+Three.js项目就完成啦
