I’m noob here. It seems UMD is a preferred format. Maybe an unpkg thing?
Could someone point me to docs/articles on why they’re used (rather than es6 modules)?
And why unpkg (love it!) seems to favor it?
I need answers mainly because I’m porting two or more repos to be very Observable. And they’re only on github at this point, not npm.
So I thought someone could point me to how to do it right!
Thanks.
Observable as a platform does not prefer UMD over ES modules. UMD (and AMD and IIFE) bundles can be loaded via require, while ES modules can be loaded via dynamic import. For example, this loads d3-color’s UMD:
d3 = require("d3-color")
While this loads it as an ES module:
d3 = import("d3-color")
Note that the latter uses unpkg’s experimental module rewriting feature; see the source. Also note that loading D3 as an ES module is typically much slower than loading it as a UMD because the ES module requires many requests and the source is not minified. (In the near future, I’ll probably provide minified, consolidated ES module bundles for D3 as well.)
Many examples use require instead of import because the libraries they use are published as UMD (or AMD or IIFE) for legacy reasons. As recent browsers now support ES modules natively (and hopefully Node, too; see the excellent @std/esm in the meantime), we expect more libraries to be published and consumed as ES modules. And thus over time we expect the usage of require to decline and eventually replaced entirely by import.
So, use whichever one you prefer. But note there are still a few things to standardize with import, such as how to resolve bare module specifiers across libraries (unpkg uses package.json).