requirejs初体验

1、引入requirejs
<script type="text/javascript" src="/js/common/require2.3.5.js" ></script>
2、配置requirejs
require.config({
        urlArgs: "r=" + (new Date()).getTime(), // 加载的js路径后面加上随机参数,防止浏览器缓存
        baseUrl: '/js/common',// 指定js目录,requirejs动态加载js的根目录
        paths: {
            jquery : 'jquery-1.12.4.min', //  /js/common目录下引入jquery-1.12.4.min.js注意这里js文件名送没有后缀的
            layer  : 'layer/layer' //  /js/common/layer/layer.js
        },
       // 唯遵守AMD规则的js文件设定方式
        shim:{
            layer:{
                deps: ['jquery', 'css!/js/common/layer/theme/default/layer.css'], //依赖jquery.js,并指定这个组件依赖的css文件注意写法,如果有css依赖那么必须用到css.min.js
                exports: 'layer'
            }
        },
        map: {
            '*': {
                // js组件依赖的css,需要用css.min.js来引入
                css: '/js/common/css.min.js'
            }
        }
    });

3、使用外部自定义的js
创建test.js
function tester() {
    console.log('------------------------');
}

使用
require(["test"],function(){
        tester();
    });


使用layer.js的例子
    require(["jquery", "layer"], function($, layer) {
//        layer.config({
//            path: '/js/common/layer/'
//        });
        layer.msg('验证中,请稍后...', {
            icon: 16
            ,shade: 0.01,
            time:0
        });
layer.alert('dddd')
    });

  

posted @ 2017-11-13 13:07  Adtuu  阅读(381)  评论(0编辑  收藏  举报