Home > other >  How to properly import THREE js library?
How to properly import THREE js library?

Time:05-18

I installed three library via npm. In the node_modules, there is three folder. But when I wanted to import like import * as THREE from 'three'; it gives ReferenceError: regeneratorRuntime is not defined, but when I use import * as THREE from 'three/build/three.cjs'; it properly works. And the same problem occurs while importing external plugins: import { OrbitControls } from "three/examples/jsm/controls/OrbitControls.js"; How can I fix this?

CodePudding user response:

Three.js uses ES6 async/await, you need to upgrade or configure your babel presets to support async/await. This may help Babel 6 regeneratorRuntime is not defined

CodePudding user response:

Make sure that you reference the correct path where your three.module is. I'd try import * as THREE from '../node_modules/three/build/three.module.js'; for a script being in the rootForlder/src/theScriptWhereYourImportIs.js. If the script is at the same hierarchy level as your node_modules folder thenn import * as THREE from './node_modules/three/build/three.module.js'; should work. As far as I remember I had to make some trials and figure this out as it was not very clear in the documentation. Any insight will be welcomed.

  • Related