requirejs是一个JavaScript模块加载器。适合在浏览器中国使用，也可以在其他脚本环境使用，它鼓励了代码的模块化。使用RequireJS加载模块化脚本将提高代码的加载速度和质量。
如何加载RequireJS呢？
　　假如项目中的JS都放在一个"script"目录下，例如有个index.html和一些script,则该布局如下:
　　项目目录:
　　·index.html
　　·scripts/
　　　　·main.js
　　　　·helper/
　　　　　　·until.js
添加require.js到scripts目录下，则该目录如下:
　　·index.html
　　·scripts/
　　　　·main.js
　　　　·require.js
　　　　·helper/
　　　　　　·until.js
为了充分利用该优化工具，可将所有的scripts放到HTML外面，然后只引用RequireJS来请求加载其他script：
可以只写一个main.js,通过它来加载你所需要运行的scripts,这可以保证你所需要的Scripts都是在这里加载的。
例如:
<!DOCTYPE html>
　　<html>
　　　　<head>
　　　　　　<title>REQUIREJS</title>
　　　　　　<script data-main="scripts/main" src="scripts/require.js"></script>
　　　　</head>
　　　　<body>
　　　　　　<h1>test</h1>
　　　　</body>
</html>

RequireJS以一个相对baseUrl的地址来加载所有代码，页面顶层<script>标签含有一个特殊的属性data-main,require.js用它来启动脚本加载过程，而baseUrl一般设置与该属性相一致的目录。下列示例中展示了baseUrl的设置:
<script data-main="scripts/main.js" src="scripts/require.js"></script>
baseUrl可以通过RequireJS config手动设置。如果没有显式指定config以及data-main,默认boseUrl包含RequireJS那个HTML页面所属的目录。

实际应用中，可将项目库和第三方库分开，为一扁平结构。
如：
　　·index.html
　　·js/
　　·app/ *项目库*
　　　　·sub.js
　　·lib/ *第三方库*
　　　　·jquery.js
　　　　·canvas.js
　　·app.js

则index.html:
<script data-main="js/app.js" src="js/require.js"></script>

app.js:
requirejs.config({
　　baseUrl: 'js/lib',
　　paths: {
　　app: '../app'
　　}
});
requirejs(['jquery', 'canvas', 'app/sub'],
function ($, canvas, sub) {

});

在实际项目中，是这样的：
·web/
　　·default.html
　　·js/
　　　　·第三方库
　　·module_js/
　　　　·原生js
　　　　·main.js
在main.js中，首部写法如下：
require(["Log","Play"....],function(doc,inc,Log....){内容函数}); //注意没有后缀

而在default.html中，首部写法如下:
通过定义一个require:
var require = {
　　baseUrl: "module_js", //baseUrl
　　urlArgs: '1.8.4',
　　map:{
　　　　"*":{
　　　　　　css:"../js/css"
　　　　　　}
　　　　}　　
};
require.paths={
  "jasmine":"../spec/jasmine-2.5.2/jasmine",
  "jasmine-html":"../spec/jasmine-2.5.2/jasmine-html",
  "runJasmine":"../spec/test/run",
  "jquery":"../js/jquery.min",
....................
};

云平台项目--学习经验--打包压缩工具requirejs的更多相关文章

  1. 云平台项目--学习经验--jsrender前端渲染模板

    jsrender的好处:可以预先自定义一些固定的html标签,在需要显示数据的时候,可以直接传入真实的数据并显示在web页面中,避免了Js编写中的复杂过程:针对高性能和纯字符串渲染并优化,不需要依赖D ...

  2. 云平台项目--学习经验--BootstrapValidate表单验证插件

    使用前提,需要加载jquery和bootstrap库.并且引入bootstrapValidator.js和bootstrapValidator.css文件然后建立一个form表单,添加表单控件,表单控 ...

  3. 云平台项目--学习经验--回调函数中call和apply

    Js中可以通过call和apply来代替另一个对象调用一个方法,将一个函数对象上下文从初始上下文改变为thisObj指定的新对象.简而言之,改变函数执行的上下文,而call和apply的基本区别在于他 ...

  4. TensorFlow-谷歌深度学习库 手把手教你如何使用谷歌深度学习云平台

    自己的电脑跑cnn, rnn太慢? 还在为自己电脑没有好的gpu而苦恼? 程序一跑一俩天连睡觉也要开着电脑训练? 如果你有这些烦恼何不考虑考虑使用谷歌的云平台呢?注册之后即送300美元噢-下面我就来介 ...

  5. .Net 分布式云平台基础服务建设说明概要

    1)  背景 建设云平台的基础框架,用于支持各类云服务的业务的构建及发展. 2)  基础服务 根据目前对业务的理解和发展方向,总结抽象出以下几个基础服务,如图所示 3)  概要说明 基础服务的发展会根 ...

  6. 将Java应用部署到SAP云平台neo环境的两种方式

    方法1 - 使用Eclipse Eclipse里新建一个服务器: 服务器类型选择SAP Cloud Platform: 点Finish,成功创建了一个Server: Eclipse里选择要部署的项目, ...

  7. .Net语言 APP开发平台——Smobiler学习日志：在应用中添加WeiXin组件

    最前面的话:Smobiler是一个在VS环境中使用.Net语言来开发APP的开发平台,也许比Xamarin更方便 控件说明 WeiXin组件. 效果演示 1. 分享好友 2. 分享朋友圈 图1 图2 ...

  8. ITOO高校云平台之考评系统项目总结

    高校云平台,将云的概念引入到我的生活, 高校云平台主要是以各大高校的业务为基础设计开发,包含权限系统,基础系统.新生入学系统.考评系统,成绩系统.选课系统,视频课系统.3月份參加云平台3.0的开发,至 ...

  9. Redis学习总结(八)--Redis云平台

    在实际生产环境中通过命令行的形式去进行集群的管理是一件很繁琐并且容易出现错误的事情,所以就引入了云平台的概念. 什么是云平台 Redis 云平台是指通过 BS 等架构实现对 Redis 的管理和监控. ...

随机推荐

  1. FreeChart柱状图中如何取消柱子的倒影

    JFreeChart柱状图中如何取消柱子的倒影,让柱子显示为一个平面图 Render 该怎么设置呢? 问题补充:已解决 intervalBarRender.setShadowVisible(false ...

  2. Tarjan-割点&桥&双连通

    $Tarjan$求割点 感觉图论是个好神奇的东西啊,有各种奇奇怪怪的算法,而且非常巧妙. 周末之前说好回来之后进行一下学术交流,于是wzx就教了$Tarjan$,在这里我一定要说: wzx  AK   ...

  3. ES6标准入门之正则表达式的拓展

    所谓正则表达式,又称规则表达式.(英语:Regular Expression,在代码中常简写为regex.regexp或RE),计算机科学的一个概念.正则表达式通常被用来检索.替换那些符合某个模式(规 ...

  4. 关于JRebel启动tomcat访问上次工程的index.jsp

    检查了一下,原来我把上次配置文件包括JRebel配置文件一起复制过来,用JRebel启动时tomcat访问JRebel配置文件的目录下 这个是我上次文件的路径,把JRebel配置文件删除了,然后 di ...

  5. Spark项目之电商用户行为分析大数据平台之（三）大数据集群的搭建

    Zookeeper集群搭建 http://www.cnblogs.com/qingyunzong/p/8619184.html Hadoop集群搭建 http://www.cnblogs.com/qi ...

  6. Docker技术入门与实战 第二版-学习笔记-3-Dockerfile 指令详解

    前面已经讲解了FROM.RUN指令,还提及了COPY.ADD,接下来学习其他的指令 5.Dockerfile 指令详解 1> COPY 复制文件 格式: COPY  <源路径> .. ...

  7. mysql用户创建与授权

    一. 创建用户 命令: CREATE USER 'username'@'host' IDENTIFIED BY 'password'; 说明: username:你将创建的用户名 host:指定该用户 ...

  8. <数据结构与算法分析>读书笔记--实现泛型构件pre-Java5

    面向对象的一个重要目标是对代码重用的支持.支持这个目标的一个重要的机制就是泛型机制:如果除去对象的基本类型外,实现的方法是相同的,那么我们就可以用泛型实现来描述这种基本的功能. 1.使用Object表 ...

  9. 简单的Tab切换组件

    由于代码都有注释,所以不多加解释,大家都知道的.直接贴代码: 代码如下: /** * 简单的Tab切换 * 支持可配置项 如下参数 */ function Tab(){ this.config = { ...

  10. ROS初级教程 cmake cmakelist.txt 的编写教程

    有很多 的时候我们使用别人的程序包.然后添加东西的时候缺少什么东西,会使程序编译不过去,甚至无法运行,接下来介绍一下cmakelist.txt 的每一行的作用.为了以后添加和修改方便. 2.整体结构和 ...