three.js代码运行问题

在学习制作three.js，学习网址：


我的代码：

img

img

img

我运行的问题：运行后网页显示空白，啥也没有，请问是什么原因呢?

img

  1. 下载最新的three.js
    git clone --depth=1  https://ghproxy.com/https://github.com/mrdoob/three.js/
  2. 在“three.js”目录创建一个test.html，内容在下面
  3. 安装python，在"three.js"目录执行python3 -m http.server 8888
  4. 浏览器访问http://localhost:8888/test.html
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>耐克</title>
    <style>
        body{ margin: 0; padding: 0; overflow: hidden;}
        canvas { width: 100%; height: 100% }
    </style>
</head>
<body>
    <script src="./build/three.js"></script>
    <script src="./examples/js/loaders/GLTFLoader.js"></script>
    <script src="./examples/js/controls/OrbitControls.js"></script>
<script>
let scene, camera, renderer;

const init = () => {
    // Scene
    scene = new THREE.Scene();
    scene.background = new THREE.Color(0x000000);

    // Renderer
    renderer = new THREE.WebGLRenderer({ antialias: true });
    renderer.setSize(window.innerWidth, window.innerHeight);
    document.body.appendChild(renderer.domElement);

    // Camera
    const aspect = window.innerWidth / window.innerHeight;
    camera = new THREE.PerspectiveCamera(20, aspect, 0.01, 1000);
    // camera.rotation.y = (90 / 180 ) * Math.PI;
    camera.position.set(0.5, 1, 1);

    // Camera Controls
    let controls = new THREE.OrbitControls(camera, renderer.domElement);
    controls.addEventListener("change", renderer);

    // Light
    const ambientLight = new THREE.AmbientLight(0xffffff);
    scene.add(ambientLight);

    // Loader
    const loader = new THREE.GLTFLoader();
    loader.load("./examples/models/gltf/SimpleSkinning.gltf", (result) => {
        scene.add(result.scene);
        animate();
    });
};

const animate = () => {
    renderer.render(scene, camera);
    requestAnimationFrame(animate);
}

init();

</script>
</body>
</html>

img

f12

拿node安装three，打包之类的，然后你点开f12看具体的错误