RequireJs 1) is a browser module loader that implements the AMD specification . It may load also other modules (UMD, CommonJs)
In this example, we will load the bowser UMD library in order to get information about your browser.
<script src="https://cdnjs.cloudflare.com/ajax/libs/require.js/2.3.6/require.min.js" integrity="sha512-c3Nl8+7g4LMSTdrm621y7kf9v3SDPnhxLNhcjFJbKECVnmZHTdo+IRO05sNLTH/D3vA6u1X32ehoLC7WFVdheg==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
require(['https://cdnjs.cloudflare.com/ajax/libs/bowser/2.11.0/bundled.min.js'], function(bowser) {
const browser = bowser.getParser(window.navigator.userAgent);
console.log(`Your browser name is "${browser.getBrowserName()}"`);
});
The steps:
<script src="https://cdnjs.cloudflare.com/ajax/libs/require.js/2.3.6/require.min.js" integrity="sha512-c3Nl8+7g4LMSTdrm621y7kf9v3SDPnhxLNhcjFJbKECVnmZHTdo+IRO05sNLTH/D3vA6u1X32ehoLC7WFVdheg==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
require.config({
paths: {
"bowser": "https://cdnjs.cloudflare.com/ajax/libs/bowser/2.11.0/bundled.min",
"domReady": "https://cdnjs.cloudflare.com/ajax/libs/require-domReady/2.0.1/domReady.min"
},
onNodeCreated: function(node, config, module, path) {
// Here's alist of differet integrities for different scripts
// Append to this list for all scripts that you want SRI for
let sri = {
"bowser": "sha512-hsF/cpBvi/vjCP4Ps/MrPUFk6l4BqcGbzVUhqjJdX2SmAri1Oj8FBUGCvBiKHYd6gg3vLsV16CtIRNOvK5X4lQ==",
"domReady": 'sha512-oeoXzE331hXr/6XbU7Vyi4cY7qg9DZuOSvSpl1gL66WyW3ghv+lV4all2A9Ht8TZ1mWIpqULz0R/hT7TdhhtlQ=='
};
if (sri[module]) {
node.setAttribute('integrity', sri[module]);
node.setAttribute('crossorigin', 'anonymous');
}
},
waitSeconds: 5
});
// Wait until the DOM is loaded (not needed but for demo purpose)
require(['domReady'], function() {
// Load bowser and pass it along
require(['bowser'], function(bowser) {
const browser = bowser.getParser(window.navigator.userAgent);
console.log(`Your browser name is "${browser.getBrowserName()}"`);
});
});
RequireJs implements the AMD api, therefore for the AMD require in RequireJs, the function is fired if the module:
It implements a AMD environment.
require("module", function(export) { export.function ... })
Because AMD is included in the UMD signature, all umd module are also supported
It also supports CommonsJs format 2)
define(function(require, exports, module) {
//Put traditional CommonJS module content here
});
Esm module are not support (for now 2022/05/16). You can use a dynamic import.
The CDN version of Dojo is built assuming that you are using the Dojo loader in order to decrease code size. Part of the code removal is the alternative has.js implementation that is used if a loader doesn’t include one (like RequireJS). You can use a regular downloaded version of Dojo with RequireJS and it will work fine, but you can’t use the CDN version.
When using dojo, it's best to use the Dojo loader.
has.js.uncompressed.js:101 Uncaught TypeError: a.add is not a function
at Object.<anonymous> (has.js.uncompressed.js:101:3)
at Object.execCb (require.min.js:1:16727)
....