require是AMD最好的实现者 2019-11-14

<!-- data-main:属性作用,设置入口文件 -->
<script src="./js/require.js" data-main="./js/index"></script>
define 用来定义一个模块
define({
  // ...
    key: value
});

define(function( ){
  // ...
    return {
        // ...
    }
});

define(['依赖的模块路径'], function(依赖模块名称){//通过依赖来获取别的模块传递的数据在回调函数中执行
 // ...
 return {
  // ...
 };
});
// 加载模块,依赖列表[],回调函数(当前我们要执行代码)
// require(['./js/module1.js','./js/module2.js','./js/jquery.js'],function (md1,md2,$){
//     md1.sayHi();
//     md2();
//     $('.btn').click(function (){
//         // alert('BMW');
//         $(this).css('color','red');
//     })
// })

// 全局配置:配置资源路径,给模块起一个别称
require.config({
    baseUrl: './js',
    paths: {
        'module1': 'module1',
        'module2': 'module2',
        'module3': 'module3',
        // 'jquery': 'http://libs.baidu.com/jquery/2.0.3/jquery'
        'jquery': ['ahttp://libs.baidu.com/jquery/2.0.3/jquery','jquery']//设置备用资源
    }
});
//在同一配置了路径之后只要require加载模块就可以执行调用了
require(['module1','module2','jquery'],function (md1,md2,$){
    md1.sayHi();
    md2();
    $('.btn').click(function (){
        $(this).css('color','red');
    })
})
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容