1.在本地搭建three.js的官网
为什么要这么做呢，因为它的官网是属于在国外的，国内需要翻墙否则就会很卡有时候会加载不出来很难定。
找到threejs的github，克隆下来。
用vscode打开，在package.json里面可以看到它的运行脚本。
先yarn一下，再yarn start就把threejs的官网搭建到本地了。
2.使用parcel搭建three.js开发环境
parcel是一个零配置的极速打包工具，可以让我们进行快速的开发。
1.首先yarn init初始化
2.通过yarn或者npm安装Parcel
yarn global add parcel-bundler 可以不用全局安装global
npm install -g parcel-bundler
3.接着，在package.json中添加任务脚本：
"scripts": {
"dev": "parcel <your entry file>", //打包的入口文件
"build": "parcel build <your entry file>" //要编译的文件
}
我们源码一般放在src下面，所以我们就新建一个src文件夹，再在里面创一个index.html文件。替代我们上方的your entry file 为 src/index.html
4.有时全局安装 Parcel 是不可能的。举个例子，假如你正在构建其他人的 build agent 或者你想使用 CI 以编程的方式构建你的项目。如果这样，你可以将 Parcel 作为本地包安装并运行。
yarn add parcel-bundler --dev
npm install parcel-bundler --save-dev
这样他就变成一个 开发的依赖
啊哦然后我发现我发现！，parcel好像更新了！ ，没错从Parcel1升级到Parcel2了。
yarn remove parcel-bundler
yarn add parcel --dev
升级一下吧~
5.在src下建立个资源文件夹assets放着imgs和css/style.css
6.往我们的index.html中里导入我们的css文件
<link rel="stylesheet" href="./assets/css/style.css">
7.在src下建立个核心引用文件夹main放着main.js
8.因为我们要进行模块化开发，我们往main.js中呢去导入我们相应的一些three.js的模块，然后在body>script里进行开发
<body>
<script src="./main/main.js" type="module"></script>
</body>
9.对css进行简单的编写
*{
margin: 0;
padding: 0;
}
body{
background-color: skyblue;
}
10.安装并导入three.js
yarn add three
在main.js中导入，打印看看
import * as THREE from 'three'
console.log({ THREE });
11.那么就可以运行了yarn dev，效果是可以看到一个天蓝色的页面并且控制台打印除了THREE的东西。
