requireJS:

(1)实现js文件的异步加载,避免页面失去响应;

(2)管理模块之间的依赖性,便于代码的编写和维护。

加载:

<script src="js/require.js" ></script>

由于加载的模块较多,可能会造成页面失去响应,故可以将此 script 标签 放到 <body> 的后面

(you could also place the script tag end of the <body> section if you do not want the loading of the require.js script to block rendering)

<script src="js/require.js" defer async="true" ></script>

或者是个该标签加上 async 属性,由于IE只支持 defer,故把该属性也一并加上

(For browsers that support it, you could also add an async attribute to the script tag.)

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

date-main 指定程序的主模块入口,(由于require.js默认文件后缀是js,故main.js可以简写成main)

程序主模块入口文件:main.js

require(['jQuery', 'underscore', 'backbone', 'moduleA', 'moduleB', 'moduleC'], function($, _, Backbone, moduleA, moduleB, moduleC) {

//some code do sth

})

第一个参数:数组,程序所依赖的模块

第二个参数:回调函数,当把前面指定的模块都加载完成后,回调函数将被调用,前面所加载的模块讲义

注:此种情况加载成功的前提是,依赖模块与main.js在同一目录下,(涉及require另已配置属性baseUrl)

模块加载自定义:require.confige()

位置:主模块main.js的顶部

参数:一个对象{}

对象属性:

/* 逐一指定路径 */

baseUrl: '',//默认值为main.js所在目录

paths:{ //相对baseUrl的路径

"jquery": "jquery",

"underscore": "underscore.min",

   "backbone": "backbone.min"

}

/* 改变基目录 baseUrl,模块取相对基目录的路径 */

baseUrl: 'js',//默认值为main.js所在目录

paths:{

//相对baseUrl的路径,路径别名,

//requery()函数的第一个参数中的元素即该属性对象的属性名如:jquery

"jquery": "libs/jquery",

"underscore": "libs/underscore.min",

   "backbone": "libs/backbone.min"

}

/* 在另一台主机上 */

paths:{

"jquery": "https://code.jquery.com/jquery-3.1.1.min.js"

}

此时如果加载多个模块的话,就会发送多次HTTP请求,为了不影响页面的加载速度,可以在模块部署完毕后,借用require.js的优化工具 ———— r.js,将这多个模块合并到一个文件中,以减少HTTP请求数。

shim: { //配置不兼容的模块

"underscore": {

exports: '_'

},

"backbone": {

deps: ['underscore', 'jquery'],

exports: 'Backbone'

}

}

//exports: 输出变量名,外部模块调用时该模块的名称

//deps: 该模块的依赖模块

requery.js加载的模块必须是 按照AMD规范、用define()函数定义的模块,由于很多库不符合该规范,故requeryJS提供了 shim 配置属性来做到兼容

 

http://www.ruanyifeng.com/blog/2012/11/require_js.html

http://requirejs.org/docs/api.html

http://www.requirejs.cn/

requireJS基本配置相关的更多相关文章

  1. Hibernate 系列 04 - Hibernate 配置相关的类

    引导目录: Hibernate 系列教程 目录 前言: 通过上一篇的增删改查小练习之后,咱们大概已经掌握了Hibernate的基本用法. 我们发现,在调用Hibernate API的过程中,虽然Hib ...

  2. linux网络配置相关命令、虚拟网络接口eth0:0

    网络接口(interface)是网络硬件设备在操作系统中的表示方法,比如网卡在Linux操作系统中用ethX,是由0开始的正整数,比如eth0.eth1...... ethX.而普通猫和ADSL的接口 ...

  3. GBrowse配置相关资料

    GBrowse配置相关资料(形状.颜色.配置.gff3) http://gmod.org/wiki/Glyphs_and_Glyph_Optionshttp://gmod.org/wiki/GBrow ...

  4. memcached的基本命令(安装、卸载、启动、配置相关)

    memcached的基本命令(安装.卸载.启动.配置相关):-p 监听的端口 -l 连接的IP地址, 默认是本机  -d start 启动memcached服务 -d restart 重起memcac ...

  5. linux网络配置相关文件

    网络接口(interface)是网络硬件设备在操作系统中的表示方法,比如网卡在Linux操作系统中用ethX,是由0开始的正整数,比如eth0.eth1...... ethX.而普通猫和ADSL的接口 ...

  6. Tomcat 参数配置相关

    Tomcat参数配置相关 by:授客 QQ:1033553122 目的: 对Tomcat配置的点滴学习总结,主要目的在于分析Tomcat与性能相关的一些参数设置,以便性能调优时选择最优配置   环境: ...

  7. Nginx 参数配置相关

    Nginx参数配置相关 by:授客 QQ:1033553122 目的: 对Nginx配置的点滴学习总结,主要目的在于分析Nginx与性能相关的一些参数设置,以便性能调优时选择最优配置   环境: $ ...

  8. 【树莓派】服务配置相关3:基于Ubuntu Server的服务配置

    该文接续之前写过的两篇: [树莓派]服务配置相关 [树莓派]服务配置相关2:基于RPi Desktop的服务配置 这是我个人用来进行树莓派盒子安装配置的脚本,对于外部其他博友,可以部分参考,但不需要逐 ...

  9. 【树莓派】服务配置相关2:基于RPi Desktop的服务配置

    该文接续之前写过的一篇:[树莓派]服务配置相关. 这是我个人用来进行树莓派盒子安装配置的脚本,对于外部其他博友,可以部分参考,但不需要逐个引用. 现在有一定更新,部分按如下脚本来操作: step1: ...

随机推荐

  1. 【算法笔记】B1031 查验身份证

    1031 查验身份证 (15 分) 一个合法的身份证号码由17位地区.日期编号和顺序编号加1位校验码组成.校验码的计算规则如下: 首先对前17位数字加权求和,权重分配为:{7,9,10,5,8,4,2 ...

  2. 在Eclipse中调试web项目

    由于现在的公司用的是Eclipse开发web项目而且不安装MyEclipse插件,没有myclipse插件就不能在Eclipse中配置web服务器,所以也就不好对web项目进行调试.下面的方法就可以让 ...

  3. Oracle PL/SQL之GROUP BY GROUPING SETS

    [转自] http://blog.csdn.net/t0nsha/article/details/6538838 使用GROUP BY GROUPING SETS相当于把需要GROUP的集合用UNIO ...

  4. 基于pydpier爬取1药网(转载)

    1.商品爬取 #!/usr/bin/env python # -*- encoding: utf-8 -*- # Created on 2019-02-02 08:59:40 # Project: o ...

  5. PIE SDK与Python结合说明文档

    1.功能简介 Python是一种跨平台语言.无论是在Windows.Linux.Unix还是Mac Os系统,我们都可以使用Python.甚至在Linux.Unix及Mac OS系统内已经集成了Pyt ...

  6. 让android系统中任意一个view变成进度条

    1.效果 2.进度条背景drawable文件 结束后可以恢复原背景. <?xml version="1.0" encoding="utf-8"?> ...

  7. mysql explain工具使用

    explain工具可以确认执行计划是否良好,查询是否走了合理的索引.查询的执行计划,随着数据的变化也可能会有变化.调用方式:explain + [sql语句]. 另外,explain是有局限性的:1. ...

  8. linux-lnmp 搭建报错

    一, 大概就是 没有php-nysql拓展 yum -y install php-mysql 二, 编辑php.ini php.ini中 添加extension=mysql.so PHP.ini 中找 ...

  9. Android:Sqlitedatabase学习小结

    今天刚刚学习完Sqlite数据库的基础知识,随即把学到的东西记录下来,以便随后查阅,以下是自己对Sqlite数据库的小结:1.Sqlite简介       Sqlite是一款轻型的数据库,它包含在一个 ...

  10. 8086中断系统——《x86汇编语言:从实模式到保护模式》读书笔记04

    80X86中断系统 能够处理256个中断 用中断向量号0-255区别 可屏蔽中断还需要借助专用中断控制器Intel 8259A实现优先权管理 1.中断的分类 中断可以分为内部中断和外部中断. (1)内 ...