在Webpack中使用Three.js的正確方法是什麼，所以我可以使用OrbitControls？

在我的WebPack配置：在Webpack中使用Three.js的正確方法是什麼，所以我可以使用OrbitControls？

resolve: { 
     alias: { 
     'three': path.resolve('node_modules', 'three/build/three.js'), 
     'OrbitControls': path.resolve('node_modules', 'three/examples/js/controls/OrbitControls.js'), 
     'OBJLoader': path.resolve('node_modules', 'three/examples/js/loaders/OBJLoader.js') 
     }

在我的模塊：

import * as THREE from 'three' // if I do import THREE from 'three' it fails with three being undefined 
import OrbitControls from 'OrbitControls' 
import OBJLoader from 'OBJLoader'

如果我使用import * THREE from 'three'一切都很好，我可以得到三個被定義並完成魔方教程毫不費力。如果我更改爲import * as THREE from 'three' three.js已加載 - 所以這不是問題？

如何獲得OrbitControls和OBJLoader的加載？當我嘗試讓它們加載時，我得到Uncaught ReferenceError: THREE is not defined(…)在OrbitControls.js之內：THREE.OrbitControls = function (object, domElement) { THREE未定義。

因此，模塊的包裝有問題嗎？我安裝了這個從https://www.npmjs.com/package/three

那麼是什麼給？ Three.js是如何打包在npm上的還是它在我的webpack.config中的配置錯誤？有沒有辦法告訴webpack「讓我們打包root three.js文件，然後打包OrbitControls.js文件」？

來源

2016-11-11 Joe C

我需要通過npm安裝three-orbit-controls和three-obj-loader。

我的模塊中

然後，將其簡單地要求他們：

var OBJLoader = require('three-obj-loader')(THREE) 
var OrbitControls = require('three-orbit-controls')(THREE)

全部搞定！

來源

2016-11-11 23:03:23

在Webpack中使用Three.js的正確方法是什麼，所以我可以使用OrbitControls？

回答

相關問題