require.js(浅聊)
一、require
了解requirejs之前首先明白什么是模块化;
1、什么是模块化?
模块化设计是指在对一定范围内的不同功能或相同功能不同性能、不同规格的产品进行功能分析的基础上,划分并设计出一系列功能模块,通过模块的选择和组合可以构成不同的产品,以满足市场的不同需求的设计方法。
我的理解就是根据不同的功能和不同的产品属性分成不同的模块,然后模块之间相互关联,构成项目(粗浅实用);
2、模块化的优点?
①、.相对独立性,可以对模块单独进行设计、制造、调试、修改和存储,这便于由不同的专业化企业分别进行生产;
②、性能稳定、结构简单、成本低廉;
③、便于维护,有利于团队开发;
3、js中模块化有哪些产品?
①、sea.js
②、require.js
4、require.js
RequireJS是一个非常小巧的JavaScript模块载入框架,是AMD规范最好的实现者之一。
require中的依赖是一个数组,即使只有一个依赖,你也必须使用数组来定义,
requir API的第二个参数是callback,一个function,是用来处理加载完毕后的逻辑。
5、加载文件
①、通过define函数定义了一个模块,然后再页面中使用:

②、加载模块
require.config是用来配置模块加载位置;
通过paths的配置会使我们的模块名字更精炼,paths还有一个重要的功能,就是可以配置多个路径;
shim配置非AMD模块输出,没有用define来申明的模块;


③、requirejs提供了一种叫"主数据"的功能,我们首先创建一个main.js:
然后再页面中使用下面的方式来使用requirejs:

加载requirejs脚本的script标签加入了data-main属性,这个属性指定的js将在加载完reuqire.js后处理,我们把require.config的配置加入到data-main后,就可以使每一个页面都使用这个配置,然后页面中就可以直接使用require来加载所有的短模块名,data-main还有一个重要的功能,当script标签指定data-main属性时,require会默认的将data-main指定的js为根路径,是什么意思呢?如上面的data-main="js/main"设定后,我们在使用require(['jquery'])后(不配置jquery的paths),require会自动加载js/jquery.js这个文件,而不是jquery.js,相当于默认配置了:
④、main的设置

require.js(浅聊)的更多相关文章
- 记录:sea.js和require.js配置 与 性能对比
最近有点忙,很久无写博客,记录一下之前的配置require.js和sea.js的配置.(有误有望提出 require.js 文件目录 /app(项目使用js) /lib(require.js jq存放 ...
- Javascript模块化编程(三):require.js的用法
Javascript模块化编程(三):require.js的用法 原文地址:http://www.ruanyifeng.com/blog/2012/11/require_js.html 作者: 阮一峰 ...
- javascript模块化编程(三):require.js用法
本文来自阮一峰 这个系列的第一部分和第二部分,介绍了Javascript模块原型和理论概念,今天介绍如何将它们用于实战. 我采用的是一个非常流行的库require.js. 一.为什么要用require ...
- require.js工作原理(初始)
详情:请见阮一峰老师的日志:http://www.ruanyifeng.com/blog/2012/11/require_js.html: 导入:<script data-main=" ...
- Javascript模块化编程(三):require.js的用法(转)
这个系列的第一部分和第二部分,介绍了Javascript模块原型和理论概念,今天介绍如何将它们用于实战. 我采用的是一个非常流行的库require.js. 一.为什么要用require.js? 最早的 ...
- require.js源码分析
写的寥寥草草,博客园的布局怎么弄还没有研究,再保存一份草稿,日后在完善,深度研究 require.js 加载顺序 1:加载html主页,require.js文件 2:脚本执行到html中的script ...
- Angular.JS + Require.JS + angular-async-loader 来实现异步加载 angular 模块
传统的 angular 应用不支持异步加载模块,必须在 module 启动的时候,所有模块必须预加载进来. 通过使用 angular-async-loader 库,我们可以使用 requirejs 等 ...
- require.js
日期: 2012年11月 7日 http://www.ruanyifeng.com/blog/2012/11/require_js.html 这个系列的第一部分和第二部分,介绍了Javascript模 ...
- require.js 入门笔记
网站越来越庞大,JS也是越写越多. 当所有的JS 都集中在 HTML的 head 部分时,网页加载变得很慢,很多的 JS代码也并不是全都适用在当前的页面,造成了代码的冗余度非常高. 而且长长的JS代码 ...
随机推荐
- Local模式下Spark程序只输出关键信息
使用spark-submit提交local任务时,会输出很多Info信息: ------------------------------------------- Time: ms --------- ...
- MySQL定时逻辑备份
当项目数据量不大时,备份可以采用逻辑备份. 数据库可以搭建一主一从,从库每天凌晨三点全量逻辑备份. 然后同时记录二进制文件,用来进行基于时间点的数据恢复. 其他备份方案详见我的思维导图:MySQL备份 ...
- RabbitMQ安装记录(CentOS)
参照官方文档:http://www.rabbitmq.com/install-rpm.html Install Erlang from EPEL 激活EPEL源: rpm -ivh http://dl ...
- 全景智慧城市——VR全景,开启VR营销新时代
全景是一种新兴的富媒体技术. 与视频.声音.图片等传统主流媒体最大的区别是"可操作,可交互". 全景给人以三维立体感觉的实景360°全方位图像,此图像最大的三个特点: 全方位:展示 ...
- Mysql数据库二进制安装
MySQL数据库有四种安装方法: 源码包编译安装 RPM包安装 二进制文件安装 官方yum源安装 这里我们主要介绍二进制包的安装方法 在MySQL官网下载二进制包并且上传到服务器上 解压二进制包 [r ...
- JavaSE教程-04Java中循环语句for,while,do···while-思维导图
思维导图看不清楚时: 1)可以将图片另存为图片,保存在本地来查看 2)右击在新标签中打开放大查看
- java学习——平台的安装与部署
Java 平台安装与部署 jre,jdk安装与部署 1)jre,jdk安装过程(略) 2)部署过程 新建(JAVA_HOME) 变量名:JAVA_HOME 变量值:E:\Program Files ( ...
- c++ const char *[] or char [][]
]={"hello","world"}; ]={"hello"};char (*ch3)[6]= ch1; std::cout<< ...
- msf 之 webshell 提权
首先建议一下到网上查查meterpreter的用法在看这篇文章,理解为什么要使用msf来提权(因为msf里边有个meterpreter很强大 ^_^)Metasploit 拥有msfpayload 和 ...
- js禁止浏览器的回退事件
直接来个终极方案: 查找了好多资料才找到的,这种方式,可以消除 后退的所有动作.包括 键盘.鼠标手势等产生的后退动作. <script language="javascript&quo ...