Getting `depthkit__WEBPACK_IMPORTED_MODULE_5___default.a is not a constructor` on imported npm module instantiation.

[heaversm]

Using:

npm i depthkit
import Depthkit from "depthkit";
const depthkit = new Depthkit(); //error

How do I properly import this as a module?

[wpreble1]

I had a similar issue with trying to use an ES6/webpack workflow. I was able to solve it by copying the contents of src/depthkit.js into my own repo. Then import directly from that file import DepthKit from './depthkit';. Then, copy lines 61 and 62 from build/depthkit.js, which contain the contents of the shaders, and replace lines 29 and 30 in src/depthkit.js. Then run npm i glslify and uncomment line 15 to make sure Three is referenced in depthkit.js.

[oliverellmers]

Hello,

I am trying to get the Depthkit.js player to work as a module for me also. I have followed your above instructions, but running into an error with the line const glsl = require('glslify'); - the error being:

Uncaught ReferenceError: require is not defined at depthkit.js:18 (anonymous) @ depthkit.js:18

I was wondering if you have experienced the same problem or have a potential solution?

Thanks

[ROBYER1]

Same issue here, why is this a package if it can't be used properly as a module? Any fix?

[ROBYER1]

I tried replacing const glsl = require('glslify'); with

import glslify from 'glslify';
// bundling of GLSL code
//const glsl = require('glslify');
const glsl = glslify;

Now I get the error: Error: It appears that you're using glslify in browserify without its transform applied. Make sure that you've set up glslify as a source transform: