scadnano icon indicating copy to clipboard operation
scadnano copied to clipboard

use npm/yarn/something more modern for using Javascript libraries

Open dave-doty opened this issue 4 years ago • 2 comments

Currently, all third-party Javascript libraries are in web/external-libs and are imported in web/index.html:

<script src="external-libs/simpledrag.js"></script>
<script src="splitpane.js"></script>

<script src="packages/react/react.js"></script>
<script src="packages/react/react_dom.js"></script>

<script src="external-libs/svg-pan-zoom.js"></script>
<script src="external-libs/hammer.min.js"></script>

<script src="external-libs/react-bootstrap.js"></script>

Each of these is a single file that creates global variables. This works but is not current recommended practice for Javascript.

There's a more modern way of installing and importing Javascript libraries, using npm, or yarn. (or both? I don't really understand them very well.) For instance, the react-svg-pan-zoom has them as two options for installing.

This will give a simpler way to update packages and avoid namespace collisions, and also some libraries (such as react-svg-pan-zoom) don't even have the option to include one giant file with global variables.

dave-doty avatar Jul 05 '20 22:07 dave-doty