【RequireJS】RequireJS完全解读

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/greatbody/article/details/54091257

文章将根据情况实时修改，不会留下修改记录，请见谅！

Why RequireJS - 为什么用它

当你的项目涉及引用很多的内容，当你的代码需要基于某些js文件已加载的前提运行，那么可以考虑requirejs了。

What It Do - 作用

它帮你管理依赖关系，在使用的时候不需要在html页面中到处嵌入js代码，或者在编写script标签的时候反复斟酌引用顺序，还需要考虑引用的js的大小来安排加载顺序，避免一次性加载过多内容。

How To Use - 用法

下载文件

推荐从github下载：https://github.com/requirejs/requirejs
1. 进入上面地址
2. 直接下载require.js文件

开发目录

可以参照这个项目：https://github.com/requirejs/example-multipage
或者如下：

• js
  
  • app(程序逻辑文件)
    
    • controller
      
      • Base.js
    • model
      
      • Base.js
    • page1_logic.js(页面逻辑代码)
    • page2_logic.js
  • lib(库文件，比如require，jquery等等)
    
    • jquery.js
    • require.js
  • common.js(配置调用require.config)
  • page1.js（页面js组织代码）
  • page2.js

页面中使用

在页面中插入script的tag，如下：

<script data-main="js/page1" src="js/lib/require.js"></script>

记住，你的整个页面只需要这一个script tag，如果可能的话。

Property - 特性

配置叠加

代码中调用requirejs.config可以调用多次，每次配置的不同的地方会被覆盖，相同的部分会保留，新增的部分会增加，减少的部分不会被减少，

例如：

requirejs.config({
    baseUrl: 'js/lib',
    paths: {
        app: '../app'
    }
});

requirejs.config({
    baseUrl: 'js/lib',
    paths: {
        lab: '../lab'
    }
});

执行之后，内存中requirejs实例中记载的paths就有两条，所以，requirejs可以实现分开配置加载。

比如Rails中的application中配置基础目录，比如js根目录，以及jquery等常用路径。

而具体的页面则可以继续配置这个页面用到的库的paths或shim。