转发
武器档案
- 名称：apache ant
- 最新版本：1.8.2
- 用途：文件构建工具
- 下载：http://labs.renren.com/apache-mirror//ant/binaries/apache-ant-1.8.2-bin.zip
- ant使用文档：http://ant.apache.org/manual/index.html
- 必备指数：
- 使用难度：
ant作为目前中国最受欢迎的开源构建工具，广泛应用于java工程构建。也许你会感到很疑惑，js作为动态语言，并不需要编译过程，为什么需要 ant这样的构建工具呢？ant能够帮助前端工程师解决那些问题呢？采用ant构建js和css的优点和缺点是什么呢？如何使用ant呢？这些问题在这个 系列教程中明河将一一解答。
1.为什么前端工程师需要ant？
来看个经典的应用场景：
在你的页面中需要引用不少的jquery插件，比如plug-1.js、plug-2.js、plug-3.js…yslow关于前端性能优化的第一建议
就是页面应该保持尽量少的js和css引用。明显这个场景违背了这个建议，所以我们需要合并这些js插件，合并成plug-combine.js文件，传
统的做法是人肉合并，以前明河也是这么干的，但遇到了如下烦恼，plug-1.js是自己写的插件，经常要更新这个文件的代码，每次更新完都要重新人肉更
新下plug-combine.js，作为一个懒人，明河在想，“有没有一个工具可以帮我自动合并文件呢？当然合并后能够自动调用压缩工具压缩文件就更棒
了！”。ant这个神奇的小工具就是用来帮前端偷这样的懒的！
ant能帮前端干些什么呢？
- 合并js/css文件；
- 调用YUI Compressor自动压缩css文件，调用Google Closure Compiler自动压缩js；
- 快速批量复制/删除指定文件；
- 调用jsDoc工具，自动生成js文档；
- 连接FTP，将代码快速发布到指定服务器；
- 将文件自动上传到svn上；
- 自动打包成zip文件
- …
ant提供了一整套的任务列表帮你从重复耗时的构建流程中解脱出来！看到ant这只神奇的蚂蚁能做如此多的事，心动了吗？那么跟着明河来学学如何使用ant。
明河要强调的一点是ant很简单，只要你有足够的耐心，你一个在1天内掌握其使用方法。
2.安装ant
1)下载ant（好吧，这是废话-_-!）
你下载下来的ant，应该包含如下文件：
2)安装java运行环境
ant是java程序，所以依赖于java运行环境，如果你的机子已经安装JDK，那么请跳过这一步，如果没有请先下载JDK，传送门在此。
（PS:请运行“CMD”，然后键入“javac”，如果出现如下界面说明java环境OK。）
如果出现“’javac’ 不是内部或外部命令，也不是可运行的程序或批处理文件。”，那么请设置下java环境变量。
设置方法参见，明河之前写的《YUI Compressor快速使用指南—web前端开发七武器》，这里不再累述。
3)配置环境变量
右击“计算机”，点击“系统设置”，出现如下界面：
新建系统变量,变量名：ANT_HOME，变量值：d:\soft\ant，变量值指向你本机ant的解压目录，请勿直接copy这个变量值。
修改变量：path，在最后添加：%ANT_HOME%\bin;
4)试运行ant
在”CMD”界面，输入“ant”，如果出现以下内容，说明配置成功！
3.ant版的hello world！
在d盘新建个ant-demo的目录。
在该目录下新建个build.xml，代码如下：
- <?xmlversion="1.0"?>
- <project name="refund"default="build">
- <target name="build">
- <echo>Hello world!</echo>
- <concat destfile="a_b.js">
- <path path="a.js"/>
- <path path="b.js"/>
- </concat>
- </target>
- </project>
再准备二个用于合并的js文件，比如a.js和b.js，（随便在二个文件中加些js代码）。
进入cmd界面，敲入ant，留意必须先将目录指向build.xml的根目录。
你将成功输出a_b.js文件，目录结构如下;
build.xml中的代码是什么意思呢？别急，下一篇教程明河将讲解ant的build文件。