javascript - Uncaught ReferenceError : THREE is not defined when importing OrbitControls and OBJLoader

Question

我刚刚在我的 html 中删除了指向 threejs 的 CDN 链接，而是使用 npm 导入了 threejs。我正在使用 webpack 来编译所有内容。然而，虽然编译时没有错误消息，但我的 webapp 中断并返回一个错误，即 THREE is not defined。以下是我正在使用的导入语句:

import * as THREE from 'three';
import OrbitControls from 'three/examples/js/controls/OrbitControls.js'
import OBJLoader from 'three/examples/js/loaders/OBJLoader.js'

浏览器控制台错误将我引导至 OrbitControls 源代码，当我注释掉其导入语句时，它会将我引导至 OBJLoader 源代码。不是我的代码，但如果您需要查看它以帮助调试，请告诉我。当我注释掉这两个输入语句，只留下 import * as THREE from 'three'; 时，页面加载没有错误，尽管我正在导入的 3d 模型没有呈现。任何帮助将不胜感激。

Answer 1

尝试使用这些导入:

import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls.js'
import { OBJLoader } from 'three/examples/jsm/loaders/OBJLoader.js'

请注意，您现在从包含 ES6 模块的 jsm 目录导入。