Require模块入门一

来源：互联网发布：淘宝宝贝截图编辑：程序博客网时间：2024/06/05 17:58

Require模块入门一

1.工程结构

-Webapp

--Js

----lib

----requirepart(app)

------monkey.js

----requiremain.js(app.js)

--requireJS.html(app.html)

2.代码分析

2.1.requireJS.html

<!DOCTYPE html>
    <head>
        <title>requireJS</title>
   <metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/>
    </head>
    <body>
        
   <scriptdata-main="js/requiremain"src="js/require.js"></script>
    </body>
</html>

2.2.requiremain.js

/**
* Created by kikop on 2017/6/4.
*/
/*
require.config执行
A.baseUrl为'js/lib', baseUrl指的模块文件的根目录，可以是绝对路径或相对路径。baseUrl，它的作用就是，以它作为基础路径，在这个路径之下，查找文件。我是将所有.js文件都放在js文件夹下的。所以，在配置这个属性后，以后的文件都是在js这个路径下查找内容了
B.paths的作用呢？就是将一些常用的js文件，换成通用的名字。例如jquery-1.8.2.min.js，我们不可能每次调用它时，都写这一啪啦吧，所以为了方便，就将jquery替代jquery-1.8.2.min.js咯，以后我们就可以直接使用jquery了，快捷方便
*/

require.config({
    baseUrl: 'js/lib',
    paths: {
        jquery: '../lib/jquery/1.8.3/jquery',
        requirepart: '../requirepart'
    }
});

/*require的作用就是执行。比如这里我只需要monkey.js去执行，所以我就导入了monkey，然后通过mk参数，
获得monkey执行后的返回值。如果有返回值，然后我们就可以对mk做相应的处理了。
*/

require(['requirepart/monkey'],function (mk) {
    mk.init_outer();
});

2.3.monkey.js

/**
* Created by kikop on 2017/6/4.
*/

/*
define的参数为匿名函数，该匿名函数返回一个对象。

return的是一个对象，提供init供其他模块调用init_outer
*/

define(['jquery'],function($){
    var init=function(){
        alert("hello,world");
    };

    return{
      init_outer:init
    };
});

阅读全文

0 0