JavaScript模块化开发框架ArchtJS

//声明包信息
//声明中的目录都是以当前js文件为起点的相对路径(类似css文件中引用图片链接)
Archt.package({
    //常用工具类
    'utils': ['lib/utils.js'],
    //jquery核心
    'lib.jquery.core': ['lib/jquery/jquery-1.10.2.js'],
    //jqueryUI
    'lib.jquery.ui': ['lib/jquery/jquery-ui-1.11.4.js'],
    //jquery滚动条插件
    'lib.jquery.plugins.mcustomscrollbar': {
        base: 'lib/jquery/plugins/mcustomscrollbar/',
        paths: ['jquery.mCustomScrollbar.css', 
                'jquery.mousewheel.min.js',
                'jquery.mCustomScrollbar.js']
    },
    //jquery树插件
    'lib.jquery.plugins.ztree': {
        base: 'lib/jquery/plugins/ztree/',
        paths: ['css/vaStyle/vaStyle.css', 'jquery.ztree.all-3.5.min.js']
    },
    //百度上传插件
    'lib.baidu.webuploader': {
        base: 'lib/baidu.webuploader/',
        paths: ['webuploader.css', 'webuploader.js']
    },
    //百度富文本编辑器
    'lib.baidu.ueditor': {
        base: 'lib/baidu.ueditor/',
        paths: ['']
    },
    //字体库
    'lib.fontawesome': {
        base: 'lib/font-awesome/',
        paths: ['css/font-awesome.min.css']
    },
    //右键菜单
    'lib.contextmenu': {
        base: 'lib/contextmenu/',
        paths: ['context-menu.js', 'context-menu.css']
    }
});
//---------------------------------------------------------------
//类所在的包
Archt.package('system.visual');
//类依赖的包(相同包下的类不需要引入依赖)
Archt.import([
	'lib.jquery.core',
	'lib.jquery.ui',
	'lib.jquery.plugins.mcustomscrollbar',
	'lib.fontawesome',
	'utils'
]);

//如果未指定类所在的包则为上一个定义类所在的包，依赖同理。
//定义类
define('Base', {
    //共有属性
    name:'base',
    //私有属性(_前缀)
    _name:'',
    //静态
    __static:{
    },
    //初始化函数
    __init:function(params){
        //私有属性
        this.myprivate = '';
        //私有方法
        this.func = function(){};
    },
    //共有方法
    public:function(){
    },
    //私有方法(_前缀)
    _private:function(){
    },
    showTime:function(){
    }
});

//继承
define('Test', 'Base', {
    __init:function(params){
        //使用静态类
        var main = this.__using('Main');
    },
    showTime:function(){
        //调用父类方法。因为有多继承，所以调用方法时需要指定父类
        this.__super.showTime['Base'].call(this);
    },
    //根据包路径管理资源文件
    getImgPath:function(){
        //获取类所在包的路径
        return this.__packageUrl + '/image/logo.png';
    }
});

//定义静态类
define('Main', function(exports, magic){
    // 通过 exports 对外提供接口
    exports.doSomething = ...
    //magic包含此类的基本信息和系统方法，例如类名、所在包、依赖包等
    
    //创建类
    var params = {};
    var test = magic.create('Test', params);
    test.public();
});

//启动入口
//静态类作为启动
runMain('system.visual.Main');
//普通类作为启动
runMain('system.visual.Test', params, callback);


//小项目不使用包依赖，可以去掉上面的包相关代码，但是需要手写加载js文件，js顺序无影响

1. 每个类的定义都可在单独的文件，加载顺序无影响

2. 如果未定义包和依赖，所有的类都在默认包package下

3. 静态类的函数只会运行一次，之后获取到的只是静态类的exports

4. 类内部的__create、__using方法只能创建类依赖的类

5. Archt.create(类名/完整类名, 参数, 依赖包数组)、Archt.using(类名/完整类名, 依赖包数组)

框架已完成，未测试，未发布过，这里只做记录，看看是否有人感兴趣