UMD czyli Uniwersalna definicja modułu (ang. Universal Module Definition) jest to sposób tworzenia definicji modułu/biblioteki JavaScript aby była możliwość korzystania z niej wszędzie.
Jeśli tworzymy bibliotekę JavaScript to warto zapewnić że będzie możliwość jej użycia w każdej sytuacji, czyli w przeglądarce lub na serwerze (node.js). Korzystając np. z require.js czyli definicji AMD lub CommonJS.
Jeśli nasza biblioteka tworzy nowy obiekt np. foo, który chcemy używać „wszędzie”, to możemy użyć poniższego kodu:
(function (root, factory) {
if (typeof define === "function" && define.amd) {
define(["underscore"], factory);
} else if (typeof exports === "object") {
module.exports = factory(require("underscore"));
} else {
root.foo = factory(root._);
}
}(typeof this == 'undefined' ? window : this, function (_) {
var foo = {
// nasza definicja obiektu foo
bar: function() {
console.log('bar');
}
};
return foo;
}));Nasza biblioteka posiada jedną zaleźnośc (underscore), w przypadku gdy nasza biblioteka nie ma zależności wystarczy poniższy kod:
(function (root, factory) {
if (typeof define === "function" && define.amd) {
define([], factory);
} else if (typeof exports === "object") {
module.exports = factory();
} else {
root.foo = factory();
}
}(typeof this == 'undefined' ? window : this, function () {
var foo = {
// nasza definicja obiektu foo
bar: function() {
console.log('bar');
}
};
return foo;
}));Nasz obiekt foo będzie dodany do obiektu globalnego, czyli window w przeglądarce, gdy dodamy nasz moduł za pomocą tagu script:
<script src="foo.js"></script>
<script>
foo.bar();
</script>Będziemy mogli go załadować przez require.js czyli:
requirejs(['foo'], function(foo) {
foo.bar();
});lub w node.js w poniższy sposób:
var foo = require('./foo');
foo.bar();Jeśli będziemy korzystali z biblioteki Babeljs, aby pisać w ES6, to wtedy będziemy mogli użyć poniższego kodu:
import foo from './foo';
foo.bar();A wszystko to dzięki temu, że dodaliśmy trochę więcej kodu do naszej biblioteki. Więcej szablonów dotyczących UMD można znaleźć na stronie projektu na githubie.
Komentarze
Hasło, które podasz umożliwi ponowne zalogowanie się i np. usunięcie komentarza, jest dobrowolne. Email jest szyfrowany i używany do wysyłania powiadomień o odpowiedziach do komentarzy oraz do pobierania awatara dzięki usłudze Gravatar.com.