关于require.js的模块化开发
先是在html的末尾引入了require.js 。
data-main属性的作用是,指定网页程序的主模块。在上例中,就是js目录下面的world.js,这个文件会第一个被require.js加载。由于require.js默认的文件后缀名是js,所以可以把world.js简写成world。
在world。js里就有两种方法进行require();
一种是配置require.config();
require.config()就写在主模块(main.js)的头部。参数就是一个对象,这个对象的paths属性指定各个模块的加载路径。


baseUrl:基目录;就是当前所需要载入模块所在目录;如果当前引用模块的目录和world.js的目录在同一文件夹下,那么就不需要设置,如果在world.js同级新建了个文件夹,这时候引用的模块就有可能在lib文件夹下,这时候设置baseUrl就可以更加方便的引入模块;


如果某个模块在另一台主机上,也可以直接指定它的网址,比如:
require.config({
paths: {
"jquery": "https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min"
}
});

也可以写成一个数组;require.js会先载入前面的模块,若前面模块无法加载。将载入后面的模块
还有一种是require(); require()函数接受两个参数。第一个参数是一个数组,表示所依赖的模块,上例就是['moduleA', 'moduleB', 'moduleC'],即主模块依赖这三个模块;第二个参数是一个回调函数,当前面指定的模块都加载成功后,它将被调用。加载的模块会以参数形式传入该函数,从而在回调函数内部就可以使用这些模块。


require()异步加载jquery api,浏览器不会失去响应;它指定的回调函数,只有前面的模块都加载成功后,才会运行,解决了依赖性的问题。
对于加载非规范的模块;我觉得阮大神写的没有任何的问题,我还是别BB了,说的太多,感觉自己都乱了,that's all;
附上阮大神的博客共三篇,讲解非常详细: http://www.ruanyifeng.com/blog/2012/11/require_js.html?bsh_bid=230697246
关于require.js的模块化开发的更多相关文章
- 【require.js】模块化开发
一.Require.js及AMD Require.js:是一个非常小巧的JavaScript模块载入框架,是AMD规范最好的实现者之一. AMD(Asynchronous Module Definit ...
- sea.js的模块化开发
为什么使用sea.js? Sea.js 追求简单.自然的代码书写和组织方式,具有以下核心特性: 简单友好的模块定义规范:Sea.js 遵循 CMD 规范,可以像Node.js 一般书写模块代码. 自然 ...
- 使用require.js编写模块化JS
layout: post title: 使用requirejs编写模块化代码 category: javascript date: 2016-10-22 00:00:00 tags: javascri ...
- require.js Javascript模块化
浏览器端的模块,不能采用"同步加载"(synchronous),只能采用"异步加载"(asynchronous).这就是AMD规范诞生的背景. AMD是&quo ...
- 模块化开发(三)---通过node.js学习模块化开发
由于改文章有点大,部分代码格式有点问题,编辑之后博客园莫名其妙推出,有问题可以留言沟通. 什么是Node? 它是一个在浏览器之外可以解析和执行javascript代码的运行环 境,或者说是一个运行 ...
- require.js 模块化
什么是模块化? 将若干功能进行封装,以备将来被重复使用. 为什么要前端模块化? 将公共功能进行封装实现复用 灵活解决依赖 解决全局变量污染 如何实现前端模块化? <!DOCTYPE html&g ...
- 前端模块化开发的价值(seaJs)
随着互联网的飞速发展,前端开发越来越复杂.本文将从实际项目中遇到的问题出发,讲述模块化能解决哪些问题,以及如何使用 Sea.js 进行前端的模块化开发. 恼人的命名冲突 我们从一个简单的习惯出发.我做 ...
- require.js源码分析
写的寥寥草草,博客园的布局怎么弄还没有研究,再保存一份草稿,日后在完善,深度研究 require.js 加载顺序 1:加载html主页,require.js文件 2:脚本执行到html中的script ...
- js模块化开发——require.js的用法详细介绍(含jsonp)
RequireJS的目标是鼓励代码的模块化,它使用了不同于传统<script>标签脚本加载步骤.可以用它回事.优化代码,但其主要的目的还是为了代码的模块化.它鼓励在使用脚本以moudle ...
随机推荐
- ELK日志收集平台部署
需求背景 由于公司的后台服务有三台,每当后台服务运行异常,需要看日志排查错误的时候,都必须开启3个ssh窗口进行查看,研发们觉得很不方便,于是便有了统一日志收集与查看的需求. 这里,我用ELK集群,通 ...
- python替换残缺的多域名图片网址
在获取网站真是图片的时候,经常遇到图片链接残缺问题. 例如下图所示的情况: img标签中的图片链接是残缺的,如果这个网站域名又是多种情况的话,比如 http://sports.online.sh.cn ...
- Java 自定义实现链表
自定义实现链表很简单,只需要明白链表是什么样子的数据结构. 下图表示一种单向列表.其中指针first指向队头,last指向队尾,curr指向当前读的数据. 下面是我的实现代码,很简单,明白上述结构后, ...
- 配置tomcat8数据源(采用局部数据源方式)
tomcat提供两种数据源配置方式,全局和局部.全局的话对于所有web应用都生效,局部只对于配置的某一个web生效. 步骤: 1.将mysql的jdbc驱动复制到tomcat的lib路径下. 2.在t ...
- Alpha冲刺No.6
站立式会议 继续页面设计 在安卓内构件数据库相应类 解决摄像头.照片的使用的异常问题 二.实际项目进展 页面设计完成百分80 类架构完成 在虚拟机中,能够完成摄像头的调用和程序的使用 三.燃尽图 四. ...
- Twisted 介绍 及TCP广播系统实例
twisted 提供更多传输层 udp,tcp,tls及应用层HTTP,FTP等协议的支持,在开发方法上更提供了丰富的特性来支持异步编程 安装twisted 建议使用anaconda 安装,conda ...
- 用python实现简单购物车功能
all_asset = 0 i1 = input("请输入总资产:") all_asset = int(i1) goods = [ {'name':'电脑','price':199 ...
- idea搭建springdata+mongodb+maven+springmvc
idea搭建springdata+mongodb+maven+springmvc 今天我们来学习一下SpringData操作MongoDB. 项目环境:IntelliJ IDEA2017+maven3 ...
- bzoj 4373 算术天才⑨与等差数列
4373: 算术天才⑨与等差数列 Time Limit: 10 Sec Memory Limit: 128 MBhttp://www.lydsy.com/JudgeOnline/problem.ph ...
- SpringMVC之HandlerMapping的使用
上篇博客在了解SpringMVC的工作流程时留了一些疑问,今天先学习下HandlerMapping,在HandlerMapping中可以通过HandlerExecutionChain getHandl ...