What is the best way to add new npm packages?

šŸŒµ Needle Engine
21

If you want to use something at runtime put it into dependencies instead.

22

As Marcel mentioned that entire import { X } from Y is really package-specific - X and Y are something you find in the documentation of that package. Thereā€™s no rule for ā€œin somePackage itā€™s always called SomePackageā€ or so, itā€™s really up to authors; many packages expose multiple things.

Hereā€™s a good summary of some patterns that you may run into - the specific one for each package will be in the packageā€™s docs: import - JavaScript | MDN

23

Thatā€™s useful to know what the devDependencies are for, I got the dependencies muddled

by user 103054507105067008

24

Useful link also, I think Iā€™ll be stuck at this for a while as the errors arenā€™t clear as I keep getting '/node_modules/.vite/deps/node_modules_depthkit.js?v=292aaf0e' does not provide an export named 'default'

by user 103054507105067008

25

This somehow worked import DepthKit from "depthkit/src/depthkit.js";, I now get errors about the use of const glsl = require('glslify'); for let rgbdFrag = glsl.file('./shaders/rgbd.frag'); as TypeError: glsl.file is not a function which I assume is an issue with using require at runtime which has led me to look into using ā€˜browserifyā€™ to resolve ā€˜requireā€™ in the browser. I hope Iā€™m on the right path hereā€¦
https://github.com/browserify/browserify#example

by user 103054507105067008

26

Iā€™m going to go back to square one and run their package as its own Three.js project and see if I can update its dependencies like Three.js then try to bring it back into Needleā€¦ my head hurts lol

by user 103054507105067008

27

It sounds like youā€™re mixing import and require, youā€™ll most likely only have import statements. If you try using glsl.file( then you need to import glsl from somewhere.

28

Looks like people had similar issues with using DepthKit as proper module: Getting `depthkit__WEBPACK_IMPORTED_MODULE_5___default.a is not a constructor` on imported npm module instantiation. Ā· Issue #11 Ā· juniorxsound/Depthkit.js Ā· GitHub

29

Going to try their fix, I wasnā€™t aware that npm packages werenā€™t all meant to run as modules which is probably where I fell over setting up. What a mess of an ecosystem in npm!

by user 103054507105067008

30

Haha yeah, basically over the years many standards emerged and only in recent years itā€™s converging on the final proper ES6 standard for how to modularize JavaScript code.