How the heck do shims work in AMD/CommonJS?

What is a shim?

It is used to integrate “old” libraries, that use a global variable, to load it in requirejs/browserify environments.

You have your own or old library or plugin that is registering itself as

var MY_UTIL = function(){};
MY_UTIL.prototype.doSth = function(sth) {};

Now you want to require/define this in AMD/CommonJS env:

require("MY_UTIL")
will fail.

That’s why you create a shim of this kind:

Whenever I require “myutil”, please provide me with the stuff that’s inside the MY_UTIL variable of the file src/js/external/myUtil.js

(yes, different cAseS are on purpose here to explain the difference of what refers to what)

paths: {
    "myutil": "src/js/external/myUtil.js"
},
shim: {
    "myutil": {
        exports: "MY_UTIL"
    }
}

Again, this will give you the window.MY_UTIL variable of the file src/js/external/myUtil.js, but now you can referto it as "myutil"