Three.js引入轨道控制器报错：THREE.OrbitControls is not a constructor

在前一章我们创建完第一个场景后，为了可以通过鼠标交互来控制相机的旋转和缩放，这里就不得不提到轨道控制器了。

一、导入轨道控制器报错

在上一篇文章的基础上，我们在项目中导入轨道控制器，以下是我最开始的导入方式

import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls'

const controls = new THREE.OrbitControls(camera, renderer.domElement)
// 渲染场景和动画
  const animate = () => {
    //进行更新
    controls.update()
  }

写入上述代码后发现控制台中报错：THREE.OrbitControls is not a constructor（THREE.OrbitControls不是构造函数）

二、解决方案

1.方案一

既然遇到了问题咱不得不去寻找解决问题的办法了，在网上查找了好多资料，最开始给出的方案是导入语法不正确，即由于 OrbitControls 是作为 ES6 模块提供的，应该使用默认导入的方式，而不是命名导入，差不多意思是去掉.js扩展名，下述方案：

import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls'

 但是该方案还是显示同样的问题，并没有正确解决

2.方案二

于是去检查three.js的版本号，刚开始我安装的版本号是0.174.0,随后进行卸载然后重新安装了0.159.0这个低版本的。可是我发现不是版本的原因，即使重新换了版本号该问题