1 index.html
2
3 复制代码
4 <doctype html>
5 <html>
6 <meta http-quiv="Content-Type" content="text/html;charset=UTF-8">
7 <script data-main="config" src="require.js"></script>
8 </html>
9 <body>
10 <h1>This is test for RequireJS</h1>
11 <script type="text/javascript">
12 alert("index");
13 </script>
14 </body>
15
16 其中，data-main指定主要的配置文件；src为requirejs的文件。
17
18 config.js
19 require.config({
20 // baseUrl:‘/‘,
21 paths:{
22 "a":"lib/a",
23 "b":"lib/b",
24 "c":"others/c"
25 }
26 });
27
28 require([‘a‘,‘b‘,‘c‘],function(a,b,c){
29 a.hello();
30 b.hello();
31 c.hello();
32 });
33
34 baseUrl指定所有文件的主要目录，paths配置模块名字以及其匹配的加载路径。
35 当有需要使用某些模块时，就可以通过require([xxx],function(xxx){xxx});的方式使用。
36
37 a.js
38 复制代码
39 define([], function() {
40 return {
41 hello: function() {
42 alert("hello, a");
43 }
44 }
45 });
46 复制代码
47 b.js
48
49 复制代码
50 define([], function() {
51 return {
52 hello: function() {
53 alert("hello, b");
54 }
55 }
56 });
57 复制代码
58 c.js
59
60 复制代码
61 define([], function() {
62 return {
63 hello: function() {
64 alert("hello, c");
65 }
66 }
67 });
main.js
1 require.config({
2
3 baseUrl: "js/lib",
4
5 paths: {
6
7 "jquery": "jquery.min",
8 "underscore": "underscore.min",
9 "backbone": "backbone.min",
10 "jquery": "https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min"
11
12 }
13
14 });
15 /*
16 require()函数接受两个参数。第一个参数是一个数组，表示所依赖的模块，
17 上例就是[‘moduleA‘, ‘moduleB‘, ‘moduleC‘]，即主模块依赖这三个模块；
18 第二个参数是一个回调函数，当前面指定的模块都加载成功后，它将被调用。
19 加载的模块会以参数形式传入该函数，从而在回调函数内部就可以使用这些模块。
20 */
21 require([‘moduleA‘, ‘moduleB‘, ‘moduleC‘], function (moduleA, moduleB, moduleC){
22
23 // some code here
24
25 });
时间： 2024-11-05 10:02:06