无法使用模块将Three.js导入Vue

Question

我通过Webpack在Vue中使用Three.js并尝试在npm three module的示例文件夹中使用TrackballControl.js。我一直在阅读如何最好地解决它并在Github上发现this解决方案。

所以在我的代码上配置并将其解释为创建一个名为three.js的文件。使用以下代码：

import * as THREE from 'three'
global.THREE = THREE;

require('three/examples/js/controls/TrackballControls');

module.exports = global.THREE;

在我的组件中导入它：

import * as THREE from './three'

但是现在我收到了

的警告

  

＆＃34;导出＆＃39; TrackballControls＆＃39; （导入为＆＃39; THREE＆＃39;）未找到   ＆＃39; ./ 3＆＃39;

     

＆＃34;导出＆＃39; WebGLRenderer＆＃39; （导入为＆＃39; THREE＆＃39;）未找到   ＆＃39; ./ 3＆＃39;

     

＆＃34;导出＆＃39;场景＆＃39; （＆＃39; THREE＆＃39;导入）未在＆＃39; ./ three＆＃39;中找到。   ...

我哪里出错，任何指针都会非常感激。

Answer 1

我正在将Webpack与Three和Vue一起使用，并用于GLTFLoader，对我来说这是可行的：

import {GLTFLoader, GLTF} from "three/examples/jsm/loaders/GLTFLoader"