三个没有定义；我该如何解决？

Question

我目前正在试验 Three.js 但我似乎无法修复此错误，我已经尝试并搜索了很多答案，但我无法修复它。

我已经包含了threejs库，并且在我的脚本中一切都写得很好

这是我的 html 索引文件

<body>
    <script src="script.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r79/three.min.js"></script>
    <script src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/242637/TrackballProjectorDetector.js"></script>
    <script src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/242637/AsciiEffect.js"></script>

</body>

这是脚本文件的一部分

function init() {
      var width = window.innerWidth || 2;
      var height = window.innerHeight || 2;
      container = document.createElement('div');
      document.body.appendChild(container);
      var info = document.createElement('div');
      info.style.position = 'absolute';
      info.style.top = '20px';
      info.style.width = '100%';
      info.style.textAlign = 'center';
      info.innerHTML = 'Drag to change the view';
      container.appendChild(info);
      camera = new THREE.PerspectiveCamera(70, width / height, 1, 1000);
      camera.position.y = 150;
      camera.position.z = 500;
      controls = new THREE.TrackballControls(camera);
      scene = new THREE.Scene();
      var light = new THREE.PointLight(0xffffff);
      light.position.set(500, 500, 500);
      scene.add(light);
      var light = new THREE.PointLight(0xffffff, 0.25);
      light.position.set(-500, -500, -500);
      scene.add(light);
      sphere = new THREE.Mesh(new THREE.SphereGeometry(200, 20, 10), new THREE.MeshLambertMaterial());
      scene.add(sphere);

我收到一条错误消息：

camera = new THREE.PerspectiveCamera(70, width / height, 1, 1000);

但是当我删除它时，错误会下降到下一个THREE元素。

Answer 1

<script src="script.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r79/three.min.js"></script>

我想说订单在这里可能很重要。 如果在加载script.js ^(a)时运行init function，则尚未定义THREE ，因为这将在下一行发生。

在这种情况下，解决方案是在脚本文件之前加载three.js 。

^(a)这通常在js文件的末尾完成，但在这种情况下我们不能确定，因为我们没有整个文件。 因此，我会查看该文件以查看它是否类似于：

function init() {
      blahBlahBlah();
}

init();

Answer 2

多年来，我一直试图弄清楚，显然有数百个 three.js 文件或每次我使用 import 它几乎可以工作，但是我需要将 three.js 加载到服务器，我必须链接到它依赖的路径文件，然后它说没有定义meshstandardmaterial，并且three.js中的示例文件夹具有额外的权限，因此您必须将依赖项移动到根文件夹并重新链接，然后它说您导入的不仅仅是一个three.js，我切换到three.min并抛出其他 function 我使用调试器并突出显示变量并在控制台中评估并查看三个变量中的内容，然后将 three.js 中的一堆变量链接到本地 scope 之类的事情，然后更好地为页面导入变量在页面顶部，但它剂量' t 在本地主机上工作，所以你必须说 import * as THREE from "http://localhost/three.js' 但我有 window.THREE = THREE;

三个没有定义；我该如何解决？

问题描述

1 个解决方案

解决方案1
1 2020-12-16 00:25:57

解决方案2
0 2021-11-14 16:43:17

三个没有定义； 我该如何解决？

问题描述

1 个解决方案

解决方案1 1 2020-12-16 00:25:57

解决方案2 0 2021-11-14 16:43:17

三个没有定义；我该如何解决？

解决方案1
1 2020-12-16 00:25:57

解决方案2
0 2021-11-14 16:43:17