最近有时间又研究了一下Threejs，之前研究过，但之后就不用了，现在就忘完了，所以这次记录一下，尤其是0到1的过程，因为网上有很多1到2的过程，但是在不了解Threejs的情况下，创建一个工程都很困难，当然现在Threejs官网做的教程也越来越详细了，打开速度也越来越友好，可以以Threejs官网为起点，进行扩展学习。
这篇文章我主要记录怎么创建一个Threejs工程，并显示模型。在开始之前有一些知识点我先列出来。
一、知识点
1）官网推荐使用Visual Studio Code
2）vscode安装eslint插件，这样对js代码就会有提示功能了
3）最新Threejs版本推荐使用ES6 Modules，所以网上大多数代码虽然可以使用但已经过时
4）ES6模块可以通过脚本中的import关键字加载，也可以通过<scritpt type="module">标签，例如以下代码：
<script type="module">
import * as THREE from '../../build/three.module.js';
...
</script>
二、创建Threejs工程
1）使用vscode新建文件
2）选择HTML语言，然后命名为index并保存文件夹中
3）在脚本中输入！回车初始化HTML脚本
3）创建js脚本，并使用MVC框架管理脚本，然后在HTML中引用js
4）打开终端，从npm下载Threejs包（命令：npm install three）
5)在js脚本中引用Threejs模块
注意：因为使用了ES6 Module特性“import”关键字，所以必须把脚本类型改为"module"。即：<script type="module" src="../Controller/LoadModel.js"></script>
6）初始化场景，需要创建WebGl渲染器，相机，场景
7）创建Threejs自带模型，模型包括网格（Mesh），几何体（Geometry），材质（Material）
8）下载Live Server插件，运行index.html脚本
9）打开浏览器，显示绿色方块，证明编译成功
当然了，这仅仅是一个开始，要使用Threejs开发出一个产品来，还需要很多知识，具体内容请参考Three官网文档。