文章/答案/技术大牛

发布

社区首页 >问答首页 >无法使用Three.js导入OrbitControls.js

问无法使用Three.js导入OrbitControls.js
EN

Stack Overflow用户

提问于 2021-01-24 05:25:45

回答 1查看 1K关注 0票数 1

我浏览了一下three.js，找到了这个例子。https://threejsfundamentals.org/threejs/lessons/threejs-load-gltf.html不幸的是，当我使用Flask在本地运行它时，所有三个导入都会出现这个错误。

import * as THREE from 'https://threejsfundamentals.org/threejs/resources/threejs/r122/build/three.module.js';
import {OrbitControls} from 'https://threejsfundamentals.org/threejs/resources/threejs/r122/examples/jsm/controls/OrbitControls.js';
import {GLTFLoader} from 'https://threejsfundamentals.org/threejs/resources/threejs/r122/examples/jsm/loaders/GLTFLoader.js';

Uncaught SyntaxError: Cannot use import statement outside a module

我到处寻找解决方案，但没有找到任何解决方案。

我还尝试使用脚本标记运行这三个导入。

<script src="{{url_for('static',filename='js/three/build/three.js')}}"></script>
<script type="module" src="{{url_for('static',filename='js/three/examples/jsm/controls/OrbitControls.js')}}"></script>
<script type="module" src="{{url_for('static',filename='js/three/examples/jsm/loaders/GLTFLoader.js')}}"></script>

这是可行的，但是当我尝试下面的代码时，我得到：Uncaught ReferenceError: OrbitControls is not defined

const controls = new OrbitControls(camera, canvas);
controls.target.set(0, 5, 0);
controls.update();

此外，如果我为GLTFLoader尝试其中一个，我会得到一个错误。

const loader = new THREE.GLTFLoader();

或

const loader = new GLTFLoader();

任何想法，我可以解决这个问题，将不胜感激。

javascript

回答 1

Stack Overflow用户

回答已采纳

发布于 2021-01-24 05:57:06

您需要说明您的脚本标记的类型是module。所以你需要的是：

<html>
  <body>
    <script type="module">
      import * as THREE from 'https://threejsfundamentals.org/threejs/resources/threejs/r122/build/three.module.js';
      import {OrbitControls} from 'https://threejsfundamentals.org/threejs/resources/threejs/r122/examples/jsm/controls/OrbitControls.js';
      import {GLTFLoader} from 'https://threejsfundamentals.org/threejs/resources/threejs/r122/examples/jsm/loaders/GLTFLoader.js';
    </script>
  </body>
</html>

票数 4

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/65864573

复制

相似问题

问无法使用Three.js导入OrbitControls.js
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问无法使用Three.js导入OrbitControls.jsEN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问无法使用Three.js导入OrbitControls.js
EN