seajs简易使用说明

一、引用

    < script src="public/js/sea.js" data-main="./main/main">< /script>

    在html页面使用script标签引入seajs文件，
    设置属性data-main=‘’指定你写的功能js代码文件，避免了在html页面上写seajs.use代码，
    当然也可以在html页面写你的代码，但是前者可以使html页面简洁得只有html代码。
            
二、配置(seajs.config)

    使用seajs.config可以配置文件的别名，路径别名等，方便其他文件使用的时候调用，避免重复及冗长的代码

        方法：
            1）.与seajs.use写在同一个文件里面（.js或者.html），seajs.config在seajs.use的上面
            2）.独立的一个配置.js文件，使用script标签在html页面中引入，位置在引入seajs的下面

        常用参数(更多参数配置请百度)：
            base：Sea.js 在解析顶级标识时，会相对 base 路径来解析。
            paths：文件夹路径配置。
            alias：文件别名配置，配置之后可在模块中使用require调用。
            示例：
                seajs.config({
                    paths: {
                       ‘js’: ‘./public/lib/js’ // js文件夹路径配置
                    },
                    alias: {
                       ‘jquery’: ‘js/jquery1.9.1’ // js文件夹下面的jquery文件
                    }
                });

                seajs.use使用：
                    seaJs.use([‘jquery’],function($){
                        $(function(){
                            // jq 代码
                        })
                    })
                其他模块调用：
                    define(function(require, exports, module) {
                        require(‘jquery’);
                        function fun(){
                            $(…)…
                        }
                    })
            
三、使用(seajs.use)

    使用seajs.use来引用你的seajs插件或者在里面写其他功能。

        seajs.use（[‘文件1′,’文件2’,…],function(参数1，参数2，…){
            参数1.方法1（）
            参数1.方法2（）
            。。。
        }）
            
四、seajs插件写法及用法

    假设插件文件为test.js.
        第一种：
            define(function(require, exports, module) {
                fun1 = function(){ alert(‘fun1’) }
                fun2 = function(){ alert(‘fun2’) }
                exports = fun1; // 可以不定义接口名称
                exports = fun2; // 可以不定义接口名称
            })
            seajs.use使用：
                seaJs.use([‘test’],function(){ //不需要设置参数
                    fun1() //直接引用
                    fun2() //直接引用
                })

        第二种：
            define(function(require, exports, module) {
                function fun1(){ alert(‘fun1’) }
                function fun2(){ alert(‘fun2’) }
                exports.f1 = fun1; // 此时exports = fun1;无效,所以需要定义接口名称
                exports.f2 = fun2; // 此时exports = fun2;无效,所以需要定义接口名称
            })
            seajs.use使用：
                seaJs.use([‘test’],function(getfun){ //对应文件设置参数 test ==> gettest
                    getfun.f1()  //由参数getfun带出f1接口内的方法fun1()
                    getfun.f2()  //由参数getfun带出f2接口内的方法fun2()
                })

        第三种：外部一般js插件改写seajs插件
                有一个dialog.js插件：
                    function dialog(){}
                    dialog.prototype.xxx = function(){}
                                .
                                .
                                .
                改写seajs插件(sea_dialog.js)：
                    1.将dialog.js的代码全部拷贝到：
                        define(function(require, exports, module) {
                            //dialog.js插件的带代码
                            exports.open = dialog;
                        })
                    2.将dialog.js插件require到seajs插件里面去：
                        define(function(require, exports, module) {
                            require(‘dialog’)
                            exports.open = dialog;
                        })

                    seaJs.use([‘sea_dialog’],function(dialog){
                        dialog.open()
                    })

        第四种：jquery插件改写seajs插件
                有一个jq插件：tab.js
                    (function($){
                        $.fn.extend({
                            tab : function(option){
                                …
                            }//tap:function()
                        });//$.fn.extend
                    }(jQuery));

                改写seajs插件：
                    (function (factory) {
                        if (typeof define === ‘function’) {
                        // 如果define已被定义，模块化代码
                        define(‘tab’,[‘jquery’], function(require,exports,moudles){
                            factory(require(‘jquery’)); // 初始化插件
                            return ‘jQuery’; // 返回jQuery
                        });
                    } else {
                        // 如果define没有被定义，正常执行jQuery
                        factory(jQuery);
                    }
                    }(function ($) { // 原jQuery插件内容
                        $.fn.extend({
                            tab : function(option){
                                …
                            }//tap:function()
                        });//$.fn.extend
                    }));

                seajs.use([‘tab’],function(){
                                    el.tab({
                                        //参数设置
                                    })
                                });