requirejs实验002. r.js合并文件. 初体验.
requirejs的官网上有介绍如何使用r.js合并,压缩文件的.http://requirejs.org/docs/optimization.html
https://github.com/jrburke/r.js/blob/master/build/example.build.js 这里罗列了所有的优化参数.
我是在win7上使用r.js的. 安装使用的是npm -> npm install -g requirejs 安装在全局,更合适,方便在任何地方使用.
windows上使用r.js有点微小不同. r.js -> r.js.cmd
我采用建立一个配置文件build.js来存放优化参数. 使用的是requirejs实验001中的项目. 如下:
({
baseUrl: '.',
// paths: {
// jquery: 'some/other/jquery'
// },
map: {
'b': {
'a': 'a.1.0'
},
'c': {
'a': 'a.1.1'
}
},
name: 'main',
out: 'main-built.js'
})
因为main.js中有配置map,所以build.js中也要配置map,否则...得不到正确的结果.
然后就是调用 r.js.cmd 来执行优化了.
r.js.cmd -o build.js optimize=none
optimize=none 表示只合并文件不压缩.
C:\wxg\test\requirejs\demo3\js
λ r.js.cmd -o build.js optimize=none Tracing dependencies for: main C:/wxg/test/requirejs/demo3/js/main-built.js
----------------
C:/wxg/test/requirejs/demo3/js/a.1.0.js
C:/wxg/test/requirejs/demo3/js/util.js
C:/wxg/test/requirejs/demo3/js/b.js
C:/wxg/test/requirejs/demo3/js/a.1.1.js
C:/wxg/test/requirejs/demo3/js/c.js
C:/wxg/test/requirejs/demo3/js/main.js
C:\wxg\test\zrender\demo\js
λ r.js.cmd -o build.js optimize=none Tracing dependencies for: main C:/wxg/test/zrender/demo/js/main-built.js
----------------
C:/wxg/test/zrender/demo/js/../../libs/zrender/src/dep/excanvas.js
C:/wxg/test/zrender/demo/js/../../libs/zrender/src/tool/util.js
C:/wxg/test/zrender/demo/js/../../libs/zrender/src/config.js
C:/wxg/test/zrender/demo/js/../../libs/zrender/src/tool/log.js
C:/wxg/test/zrender/demo/js/../../libs/zrender/src/tool/guid.js
C:/wxg/test/zrender/demo/js/../../libs/zrender/src/tool/env.js
C:/wxg/test/zrender/demo/js/../../libs/zrender/src/mixin/Eventful.js
C:/wxg/test/zrender/demo/js/../../libs/zrender/src/tool/event.js
C:/wxg/test/zrender/demo/js/../../libs/zrender/src/tool/vector.js
C:/wxg/test/zrender/demo/js/../../libs/zrender/src/tool/matrix.js
C:/wxg/test/zrender/demo/js/../../libs/zrender/src/Handler.js
C:/wxg/test/zrender/demo/js/../../libs/zrender/src/tool/curve.js
C:/wxg/test/zrender/demo/js/../../libs/zrender/src/tool/area.js
C:/wxg/test/zrender/demo/js/../../libs/zrender/src/mixin/Transformable.js
C:/wxg/test/zrender/demo/js/../../libs/zrender/src/tool/color.js
C:/wxg/test/zrender/demo/js/../../libs/zrender/src/shape/Base.js
C:/wxg/test/zrender/demo/js/../../libs/zrender/src/shape/Text.js
C:/wxg/test/zrender/demo/js/../../libs/zrender/src/shape/Rectangle.js
C:/wxg/test/zrender/demo/js/../../libs/zrender/src/loadingEffect/Base.js
C:/wxg/test/zrender/demo/js/../../libs/zrender/src/Layer.js
C:/wxg/test/zrender/demo/js/../../libs/zrender/src/shape/Image.js
C:/wxg/test/zrender/demo/js/../../libs/zrender/src/Painter.js
C:/wxg/test/zrender/demo/js/../../libs/zrender/src/Group.js
C:/wxg/test/zrender/demo/js/../../libs/zrender/src/Storage.js
C:/wxg/test/zrender/demo/js/../../libs/zrender/src/animation/easing.js
C:/wxg/test/zrender/demo/js/../../libs/zrender/src/animation/Clip.js
C:/wxg/test/zrender/demo/js/../../libs/zrender/src/animation/Animation.js
C:/wxg/test/zrender/demo/js/../../libs/zrender/src/zrender.js
C:/wxg/test/zrender/demo/js/../../libs/zrender/src/animation/animation.js
C:/wxg/test/zrender/demo/js/../../libs/zrender/src/shape/Circle.js
C:/wxg/test/zrender/demo/js/main.js
requirejs实验002. r.js合并文件. 初体验.的更多相关文章
- require.js 加载 vue组件 r.js 合并压缩
https://www.taoquns.com 自己搭的个人博客 require.js 参考阮一峰 Javascript模块化编程(三):require.js的用法 r.js 合并压缩 参考司徒正美 ...
- 转: requirejs压缩打包r.js使用示例 2 (~~很详细的教程)
这一篇来认识下打包工具的paths参数,在入门一中 就介绍了require.config方法的paths参数.用来配置jquery模块的文件名(jQuery作为AMD模块时id为“jquery”, 但 ...
- 转:requirejs打包压缩r.js使用示例
为了应对日益复杂,大规模的JavaScript开发.我们化整为零,化繁为简.将复杂的逻辑划分一个个小单元,各个击破.这时一个项目可能会有几十个甚至上百个JS文件,每个文件为一个模块单元.如果上线时都是 ...
- r.js合并实践 --项目中用到require.js做生产时模块开发 r.js build.js配置详解
本文所用源代码已上传,需要的朋友自行下载:点我下载 第一步: 全局安装 npm install -g requirejs 第二步: 1.以下例子主要实现功能, 1)引用jq库获取dom中元素文本, ...
- r.js合并实践
项目中用到require.js做生产时模块开发,但上线要合并压缩,幸好它配套有r.js.下面就其用法说明一下. 首先建一个目录,里面的结构如下: require.js可以到r.js项目下载 r.js可 ...
- requirejs 使用实例r.js打包
在这里,请先看基础文章与相关技术文档: 安装: npm init npm install requirejs --save npm install jquery@1.11.1 --save 创建基本目 ...
- js随堂初体验(一)
Js初体验(-) 1 js的基础知识 A web三大标准:1 html:结构标准 2 css:表现标准 3 javascript:行为标准 B js三种书写方式:1 行内js:onclick ...
- Node.js后台开发初体验
Node.js是什么 Node.js是一个Javascript运行环境(runtime),发布于2009年5月,由Ryan Dahl开发,实质时对Chrome V8引擎进行了封装 Node.js安装 ...
- r.js结合gulp等于webpack(angular为例)
本人大学时玩dojo,开始了AMD模块化的不归路,工作后一直使用requirejs,感觉非常好.但是,近来随着react的火热,webpack成为了天下无敌的模块化工具,能做模块化,合并压缩,监视等, ...
随机推荐
- Hdu 5568 sequence2 高精度 dp
sequence2 Time Limit: 20 Sec Memory Limit: 256 MB 题目连接 http://acm.hdu.edu.cn/showproblem.php?pid=556 ...
- 算法:排序----Java选择排序
public static void selectionSort(int[] arr) { int len = arr.length; for (int i = 0; i < len; i++) ...
- ListView往TreView里面拖拽
ListView往TreView里面拖拽 unit Unit1; interface uses Windows, Messages, SysUtils, Variants, Class ...
- iOS开发——实用篇&提高iOS开发效率的方法和工具
提高iOS开发效率的方法和工具 介绍 这篇文章主要是介绍一下我在iOS开发中使用到的一些可以提升开发效率的方法和工具. IDE 首先要说的肯定是IDE了,说到IDE,Xcode不能跑,当然你也可能同时 ...
- UML视图(九)部署图
一.什么是部署图? 部署图对面向对象系统的物理方面建模,描写叙述系统执行时节点.构件实例及其对象的配置.主要用来在部署系统时涉及到的硬件(处理器和设备)进行建模. 二.部署图的组成元素? 部署图主要包 ...
- php上传常见文件类型对应的$_FILES["file"]["type"](转)
php上传常见文件类型对应的$_FILES["file"]["type"] from:http://hi.baidu.com/7book/item/374971 ...
- android复合控件
一.复合控件TopBar 创建复合控件可以很好地创建出具有重用功能的控件集合.比如TopBar. 做法:一般需要继承ViewGroup,再给它添加指定功能的控件. 以TopBar为例: 1 ...
- CSS: Float a div on another div, Ex: Text caption on picture
<style type="text/css"> .figure { width: 316px; height: 205px; display: block; borde ...
- linux上传下载
linux传下载 1.可以通过xftp连接服务器直接 拖拽 2.yum install lrzsz 通过rz/sz命令上传下载
- javaweb学习总结九(xml解析以及调整JVM内存大小)
一:解析XML文件的两种方式 1:dom,document object model,文档对象模型. 2:sax,simple API for XML. 3:比较dom和sax解析XML文件的优缺点 ...