Parcel搭建three.js环境
1.创建一个空项目文件夹
2.在根目录下npm init
3.npm install parcel --save-dev
4.npm install three --save-dev
5.找到package.json,修改代码块地方
package.json:
{
“name”: “01-three_basic”,
“version”: “1.0.0”,
“description”: “”,
“main”: “index.js”,
"scripts": {
"dev": "parcel src/index.html",
"build": "parcel build src/index.html"
},
“author”: “”,
“license”: “ISC”,
“devDependencies”: {
“parcel”: “^2.4.1”
},
“dependencies”: {
“dat.gui”: “^0.7.9”,
“gsap”: “^3.10.3”,
“three”: “^0.139.2”
}}
在项目下创建src目录和index.html文件,且在src目录下创建main文件夹,在main文件夹下创建main.js
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>三维</title>
</head>
<body>
<link rel="stylesheet" href="css/main.css"/>
<script src="main/main.js" type="module"></script>
</body
</html>
main.js
import * as THREE from “three”;
console.log(THREE.REVISION);
测试环境时是否搭建成功