ModuleJS — это модульный менеджер JavaScript, совместимый с нормами CMD, AMD и UMD.
npm i silis-modulejs
Файл | Размер файла | Описание |
---|---|---|
module.min.js.zip | 1.18кБ | Сжатый JS-код + ZIP-сжатие, используется в рабочей среде с более высокими требованиями к сети |
module.min.js | 2.4кБ | Сжатый JS-код, используется в рабочей среде |
module.js | 7.3кБ | Исходный JS-код, используется при разработке и тестировании |
define(function(){
...
})
define("myModule.js", [], function(){
...
})
return
define(function(){
return ... //Экспортируется любой тип данных
})
exports
exports
для экспорта модуляdefine(function(require, exports, module){
exports.sayHello = ...
})
exports
для экспорта модуляdefine(["exports"], function(exports){
exports.sayHello = ...
})
module.exports
module.exports
для экспорта модуляdefine(function(require, exports, module){
module.exports = ...
})
module.exports
для экспорта модуляdefine(["exports"], function(exports){
module.exports = ...
})
(
(typeof window === 'object' && window) ||
(typeof global === 'object' && global)
).myModule = ... //Экспортируется любой тип данных
```### Импорт модулей
1. Синхронный импорт модулей
- Синхронный импорт одного модуля
var myModule = require('myModule.js');
или
var myModule = require('myModule.js', false);
- Синхронный импорт нескольких модулей
var myModule1 = require('myModule1.js'); var myModule2 = require('myModule2.js');
или
var myModule1 = require('myModule1.js', false); var myModule2 = require('myModule2.js', false);
2. Асинхронный импорт модулей
- Асинхронный импорт одного модуля
require('myModule.js', function(myModule){ ... });
или
var myModulePromise = require('myModule.js', true); myModulePromise.then(function(myModule){ ... });
- Асинхронный импорт нескольких модулей
require(['myModule1.js'], function(myModule1){ ... });
или
var myModulesPromise = require(['myModule1.js'], true); myModulesPromise.then(function(modules){ var myModule1 = modules[0]; ... });
### Зависимые модули
1. Предварительная загрузка зависимого модуля
```javascript
define(["dependentModule1.js"], function(dependentModule1){
var mainModule = {
subModule1: dependentModule1
};
return mainModule;
})
define(function(){
var mainModule = {
subModule1: require("dependentModule1.js")
};
return mainModule;
})
define(function(){
var mainModule = {};
return require(["dependentModule1.js"], function(dependentModule1){
mainModule.dependentModule1 = dependentModule1;
return mainModule;
})
})
AMD-нормат указывает на асинхронное определение модулей (Asynchronous Module Definition), то есть загрузку модулей асинхронным способом.Определение модуля в соответствии с AMD-нормативом:
define(function() {
return function(text) {
setTimeout(function() {
document.body.innerText = text;
}, 100);
}
});
Файл кода: /example/print-amd-module.js
define(["print-amd-module.js"], function(print) {
return {
sayHello: function() {
print("Привет, мой модуль, определенный согласно нормативу AMD");
}
}
});
Файл кода: /example/hello-amd-module.js
Асинхронная загрузка модуля, определенного в соответствии с AMD-нормативом:
<!DOCTYPE html>
<html>
<head>
<script>
require(["hello-amd-module.js"], function(helloAmdModule) {
helloAmdModule.sayHello();
})
</script>
</head>
<body>
Загрузка асинхронного модуля...
</body>
</html>
Файл кода: /example/async-load-amd-module-example.html
CMD-норматив указывает на синхронное определение модулей (Common Module Definition), то есть загрузку модулей синхронным способом.
Определение модуля в соответствии с CMD-нормативом:
define(function(require, exports, module) {
module.exports = function(text) {
setTimeout(function() {
document.body.innerText = text;
}, 100);
}
});
Файл кода: /example/print-cmd-module.js
define(function(require, exports, module) {
exports.sayHello = function() {
var print = require("print-cmd-module.js");
print("Привет, мой модуль, определенный согласно нормативу CMD");
}
});
Файл кода: /example/hello-cmd-module.js
Синхронной загрузкой модуля, определённого в соответствии с CMD-нормой:
<!DOCTYPE html>
<html>
<head>
<script>
var helloCmdModule = require(["hello-cmd-module.js"]);
helloCmdModule.sayHello();
</script>
</head>
<body>
Загрузка синхронного модуля...
</body>
</html>
```> Код файла: /example/sync-load-cmd-module-example.html
### Пример CMD-нормы
```javascript
((root, factory) => {
if (typeof define === "function" && define.amd) {
// AMD
define(["dependentModule1", "dependentModule2"], factory);
} else if (typeof exports === 'object') {
// CommonJS
module.exports = factory(require("dependentModule1"), require("dependentModule2"));
} else {
root.currentModule = factory(root.dependentModule1, root.dependentModule2);
}
})(
(typeof window == "object" && window) || (typeof global == "object" && global),
(dependentModule1, dependentModule2) => {
// TODO
}
)
Вы можете оставить комментарий после Вход в систему
Неприемлемый контент может быть отображен здесь и не будет показан на странице. Вы можете проверить и изменить его с помощью соответствующей функции редактирования.
Если вы подтверждаете, что содержание не содержит непристойной лексики/перенаправления на рекламу/насилия/вульгарной порнографии/нарушений/пиратства/ложного/незначительного или незаконного контента, связанного с национальными законами и предписаниями, вы можете нажать «Отправить» для подачи апелляции, и мы обработаем ее как можно скорее.
Комментарий ( 0 )