我正在尝试自己创建一个基于自定义模块的应用程序。
第一个想法:
我希望有几个模块,它们都代表一个文件)
1模块: 对象,带文件名。 Object.js 第二个模块: 实用程序,文件名为Utils.js
现在你可以在我的代码中看到我使用get脚本来加载所有这些文件并准备一个全局应用程序对象,我可以在我的应用程序中使用它。
但是我想在开发结束时将所有js组合起来并将其缩小,所以基本上我不知道如何检查(并注册)那些需要文件本身的模块。这是我的app.js和我的Object.js
app.js:
var shop = (function () {
'use strict';
var modules = [];
var getModulesDir = function () {
return document.location.origin + "/js/App/modules/"
}
var registerDefaultModules = function () {
modules.push({
name: "Object",
alias: "Object"
}, {
name: "Utils",
alias: "Utils"
});
};
var loadModules = function () {
jQuery.each(modules, function (key, module) {
if (module.name == "") {
console.error("loading script without name");
return true;
}
if (module.alias == "") {
module.alias = module.name;
}
if (typeof shop[module.alias] !== "undefined") {
return true;
}
window.moduleAlias = module.alias;
var path = "";
if (typeof module.path != "undefined") {
path = module.path;
}
if (path == "") {
path = getModulesDir() + module.name.split('.').join('/') + ".js";
}
$.getScript(path)
.done(function (script, textStatus) {
})
.fail(function (jqxhr, settings, exception) {
console.error('failed loading a script')
});
});
}
var init = function () {
registerDefaultModules();
loadModules();
}
return {
init: init
};
})();
jQuery(document).ready(function () {
shop.init();
});
Object.js
(function($, app) {
$(window).load(function(event) {
'use strict';
app.Object = {
getSize: function(object) {
var size = 0,
property;
for (property in object) {
if (object.hasOwnProperty(property)) {
size++;
}
}
return size;
}
}
return app;
});
})(jQuery, shop);
我可能完全错了,如果有人告诉我正确的做法,那就好了。