requireJs--简单的使用方法

Posted 2020-08-25 雨中伞

简单使用:

<!-- index.html部分  data-main 为入口  -->
<script data-main="js/app.js" src="node_modules/requirejs/require.js"></script>   

// app.js 部分
requirejs.config({
    baseUrl: ‘ app/js/ ‘,       //基本路径
    shim: {                       //bootstrap依赖与jquery
        bootstrap: {
            deps: [‘jquery‘],
            exports: ‘bootstrap‘
        }
    },
    paths: {                     //路径  默认管理js文件  所以不需要加后缀名
        jquery: ‘jquery/dist/jquery.min‘,
        bootstrap: ‘bootstrap/dist/js/bootstrap.min‘,
    }
});


requirejs([‘jquery‘, ‘bootstrap‘],
    function ($) {
       //加载完依赖的模块执行的代码
    });

requireJs是相对于baseUrl的地址来加载资源的,

注意:

　　①:如果app.js中baseUrl 和 index.html中的data-main都不进行设置, 默认了baseUrl指的是 引入requireJs的目录.

　　②:requireJs 假设的所有资源都是js资源,所以不需要加后缀名.

　　③:当出现以下情况时不会按照 baseUrl+moduleId规则加载资源

• • 以‘/‘开始
  • 以‘.js‘结尾
  • 包含URL协议　　　　　　

 模块的定义

define("foo/title",
        ["my/cart", "my/inventory"],
        function(cart, inventory) {
            //Define foo/title object in here.
       }
    );