我如何在 three.js 中导入 OrbitControls

Question

我尝试导入 OrbitControls 但它不起作用。
我导入了 three.js 然后尝试导入 OrbitControls 但它不起作用我用这个命令在 html 的正文中导入了 three.js script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/104/three.js" 注意：我确实有一个场景、一个相机和一个渲染器，但我不能 post 这个 post 在这里

<!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>Document</title>
    <link rel="stylesheet" href="Css/master.css">
</head>
<body>
   <script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/104/three.js"></script>
   <script src="Main.js"></script>
</body>
</html>
  ***Main.js***
import { OrbitControls } from 'three/example/jsm/controls/OrbitControls';
   
   
    const controls = new OrbitControls(camera, renderer.domElement);
    function animate(){
        requestAnimationFrame(animate);
        torus.rotation.x +=0.01;
        torus.rotation.y +=0.01;
        torus.rotation.z +=0.01;
        controls.update();
        renderer.render(scene,camera);
    }
    animate()

Answer 1

您正在使用 jsm 版本的 OrbitControls，这意味着您需要一个用于 Javascript 文件的模块。变化：

<script src="Main.js"></script>

到

<script type="module" src="Main.js"></script>

这应该可以解决问题。

我如何在 three.js 中导入 OrbitControls

How do i import OrbitControls in three.js

javascript

three.js