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

【问题标题】：Can't import Three.js into Vue with modules无法使用模块将 Three.js 导入 Vue
【发布时间】：2018-06-10 15:05:05
【问题描述】：

我正在通过 Webpack 将 Three.js 与 Vue 一起使用，并尝试从 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'

但是现在我收到了警告

“导出 'TrackballControls'（导入为 'THREE'）未在 './三'

"export 'WebGLRenderer' (imported as 'THREE') is not found in './三'

“在'./three'中找不到导出'Scene'（导入为'THREE'） ...

我哪里出错了，不胜感激。

【问题讨论】：

标签： webpack vue.js three.js

【解决方案1】：

我将 Webpack 与 Three 和 Vue 以及 GLTFLoader 一起使用，对我来说这是可行的：

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

【讨论】：