How to know when to import a package or paste it in index.html

Question

OK, I am using ES6 and ReactJS, some packages you should do import React from "react"; in order to have them working, but others <script src="/semantic/dist/semantic.min.js"></script> in index.html, so, what cases should I apply one or another ?

Answer 1

In general, there are two types of modules. ES6 and non-ES6. If you want to use a non-ES6 modules with ES6, you can try one of the following approaches:

1. Compile with the CommonJS (for example using jQuery as CommonJS through npm)
2. Load with SystemJS to allow ES6 to work with CommonJS, AMD and globals

If you don't want to do this, you can try importing the non-ES6 scripts in HTML. In which case, you won't be doing something like

import $ from 'jquery';

So in short, if you want to use a non-ES6 module without compiling with CommonJS or if it is not available through npm, you can use HTML imports instead of ES6 import