2013年1月23日星期三

【转】用jake打包js项目文件

转载自 http://ssup.kuantu.com/ 

你的Js项目下有一堆js文件需要打包?还是说你一直都在一个js文件里写所有的项目class?

Jake是为了解决上面的问题而诞生的。 

基于下面两个前提,jake是打包js的神器。 

1开发时把不同功能模块的class写到不同的js文件里更好。 
2用户访问网站时,js文件数越少越好 


获取jake: http://github.com/jcoglan/jake 

jake根据YAML文件打包(字符串拼接、优化压缩)Js文件。此外,他还允许用ERB在代码中产生代码,最后,他还可以在打包结束后做一些文件复制删除之类的批处理。 

安装 

sudo gem install jake 

使用说明 

在项目根目录下创建一个jake.yml文件,基本的配置如下: 


--- 
source_directory: source 
build_directory: build 

layout: together 

header: COPYRIGHT 

builds: 
src: 
packer: false 
min: 
shrink_vars: true 
private: true 

packages: 
[ 下面详细描述 ] 

"source_directory" 是相对jake.yml,你的源码的所在地,“build_directory”则是所有打包后的文件放置的地方。 

"layout"描述打包后的文件是都输出到同一个文件夹还是目录的放置:"together"(build/foo-src.js 和 build/foo-min.js) / "apart"(build/src/foo.js 和 build/min/foo.js.) 

"header" 文件头,例如copyright和版权信息 

“builds”:描述打包的方式,你可以有多个打包方式(src,min。。。名字自己取,随便) 

* packer: false - 是否压缩代码 
* shrink_vars: true - 压缩function内的局部变量名 
* private: true - 将私有变量替换成“_0, _1...” 
* base62: true - base-62压缩 
* suffix: false - 文件后缀, 你会得到 build/foo.js 而不是 build/foo-src.js, !!!只有一个build可以使用这个参数 

“packages”:不同的builds需要打包哪些源代码。“.js”扩展名不需要写 

选项说明 
* files - 打包哪些文件 
* extends -从其他package继承配置 
* directory - 指定从“source_directory”下的某个目录查找源代码 
* header - 文件头信息,可以覆盖根目录的文件头 
* packer - 可以覆盖根目录的packer配置 
* meta - 用户自定义的event 

例子 

packages: 
foo_dist: foo 

bar: 
- bar1 
- bar2 

sub/whizz: 
extends: foo_dist 
directory: path 
header: CUSTOM_HEADER 
files: 
- file1 
- file2 

last: 
packer: 
private: false 
meta: 
requires: 
- jQuery 
- GMap2 
files: 
- one_file 
- another_file 

打包结果如下 

- build/ 
- sub/ 
- whizz.js 
- bar.js 
- foo_dist.js 
- last.js 
- source/ 
- path/ 
- CUSTOM_HEADER 
- file1.js 
- file2.js 
- another_file.js 
- bar1.js 
- bar2.js 
- foo.js 
- one_file.js 
- COPYRIGHT 
- jake.yml 


使用ERB功能,需要创建一个jakefile文件。 

在源代码中使用ERB的例子 

MyJavaScriptLib.VERSION = "<%= version %>-<%= build %>"; 

jakefile例子 

jake_helper :version do 
# extract version number from svn, git, whatever 
# e.g. return '1.0' 
end 

结果: 

MyJavaScriptLib.VERSION = "1.0-src"; // or "1.0-min" for the 'min' build 

Event hooks 

两个事件: 

file_created 新的build文件创建时触发 

build_complete 在build完成后触发 

例子: 

$register = {} 

jake_hook :file_created do |build, pkg, build_type, path| 
$register[path] = pkg.meta 
end 

jake_hook :build_complete do |build| 
FileUtils.cp 'README', build.build_directory + '/README' 
# generate code from $register 
end 

没有评论: