首先，我想说的是，我对JavaScript和使用库非常陌生。我试图让一些基本的three.js代码工作，但它不工作，我不知道为什么。我已经使用Threejs.org文档设置了一个基本的场景，我试图设置一些基本的轨道控制。一切正常，直到我试图将轨道控制导入到我的主脚本文件。然后我得到一个错误：
未捕获的TypeError：未能解析模块说明符“three”。相对引用必须以“/"、“./"或“../"开头。
我还没有尝试解决我的问题，因为我甚至不知道从哪里开始。我已经检查了我的拼写，并确保我有正确的相对路径为我的进口。
下面是运行的代码：
import * as THREE from '/node_modules/three/build/three.module.js';
// import { OrbitControls } from '/node_modules/three/examples/jsm/controls/OrbitControls.js';
// Construct basic scene elements
const camera = new THREE.PerspectiveCamera(
75,
window.innerWidth / window.innerHeight,
1,
1000
);
const renderer = new THREE.WebGLRenderer();
const scene = new THREE.Scene();
// const controls = new OrbitControls(camera, renderer.domElement);
// Set parameters for scene elements
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);字符串
当我取消注解轨道控件的第二个导入时，它会中断并给我上面的错误。是什么导致了错误，我如何修复它？
先谢了。
3条答案
按热度按时间nc1teljy1#
从今天开始轻松修复：
变化
第一个月
到
import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls';个资料来源：
三年前是
three-orbitcontrols最后一次发布。它现在已经被弃用，在npm的页面顶部有以下内容：“作者留言”：
three-js现在通过three/examples/jsm/暴露真实的模块.
svmlkihl2#
您可以用途：从“https://threejs.org/examples/jsm/controls/OrbitControls.js“导入{ OrbitControls };
ohtdti5x3#
欢迎来到Stack Overflow。您的问题似乎遗漏了一些信息，因此我将根据您提供的内容进行一些假设。如果我的任何假设不正确，请更新您的问题以提供更多细节。
我的主要假设是你在你的
HTML中使用了一个<script>标签来引用你的主文件，并且你 * 没有 * 使用任何JavaScript捆绑工具，比如提到的Mugen87。如果是这样的话，那么你所拥有的就很好，* 但是 *，OrbitControls* 将无法工作 *，除非你修改它。如果深入研究
OrbitControls.js文件，您将看到（当前版本为r.130.1）：字符串
from引用假设您是在npm上下文中使用该模块，而不是在浏览器中。浏览器对npm软件包一无所知，并且无法将three解析为node_modules路径，从而导致您看到的错误。要使此工作正常，您需要修改引用以指向正确的模块路径。我个人不喜欢修改
node_modules内部的文件，所以我推荐以下方法：1.创建一个名为
vendor_mods/three/examples/jsm/controls的新文件夹，并将OrbitControls.js复制到其中。1.将复制文件中的
from引用更改为指向/node_modules/three/build/three.module.js1.更改主文件中的引用以指向修改后的
OrbitControls.js。现在，浏览器可以正确地引用所有片段，每个人都应该感到高兴。