RequireJS 加载 js 执行顺序

初次接触RequireJS 对文档理解不很透彻,自己通过测试测到的执行顺序:

文档结构:

|-amaze

  | -js

    | -amazeui.js

    | -jquery.min.js

    | -main.js

    | -test.js

  | index.html

 

index.html

 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="utf-8" />
 5         <title>商城首页</title>
 6         <script src="//cdn.bootcss.com/require.js/2.1.22/require.js" data-main="js/main"></script>
 7     </head>
 8     <script>
 9         alert("index-test前");
10         require(['test']);
11         alert("index-test后");
12     </script>
13     <body>
14         <div id="css"></div>
15     </body>
16     <script>
17         alert("body后");
18     </script>
19 </html>

main.js

 1 require.config({
 2     paths:{
 3         jquery:"jquery.min"
 4     },
 5     shim:{
 6         amazeui:{
 7             deps:['jquery']
 8         }
 9     }
10 })
11 
12 require(['jquery','amazeui'],function(){
13     alert("main")
14     var a = '测试';
15 });


test.js

1 define(['jquery.min','amazeui','require'],function(){
2     alert("test");
3     console.log($("#css").css({'width':'200px','height':'200px','background':'red'}));
4 });

执行index.html页面,测试得出弹出顺序为:

  head  =>  body后   =>  test.js  => main.js

原文地址:https://www.cnblogs.com/zouqin/p/5435114.html