ant build tool
DESCRIPTION
Using Ant with Yahoo CompressorTRANSCRIPT
04/12/23HUGE / ParentsConnect / 1
HUGE45 Main Street, 2nd Floor NY NY 11201718.625.4843 www.hugeinc.com
step-by-step guide
Ant Build Tool
May 22nd, 2008
HUGE / Ant 2
Introduction
• Ant is a Java-based build tool. • It is kind of like Make, without Make's
wrinkles and with the full portability of pure Java code.
HUGE / Ant 3
Prerequisites
• apache ant (http://ant.apache.org/)
• yui compressor (http://developer.yahoo.com/yui/compressor/)
• yui compressor ant task (http://code.google.com/p/javaflight-code/)
HUGE / Ant 4
Installation
• download ant binary files, uncompress it, and add bin folder to system path
• download yahoo compressor and copy yuicompressor-x.x.x.jar to ant’s lib folder
• download yahoo compressor ant task and copy yui-compressor-ant-taks-x.x.jar to ant’s lib folder
HUGE / Ant 5
Folder Structure
• trunk/deploy– /wwwroot
• /css• /js• /img• /inc
– build.xml– /wwwroot-compressed
HUGE / Ant 6
1. Build Script
<project name=“HUGE" default="build" basedir=".">
<taskdef name="yui-compressor" classname="net.noha.tools.ant.yuicompressor.tasks.YuiCompressorTask"></taskdef>
<property name="src" location="wwwroot"/>
<property name="build" location="wwwroot-compressed"/>
...
</project>
HUGE / Ant 7
2. Build Script
<target name="build" description="generate the distribution">
…
</target>
HUGE / Ant 8
3. Build Script
<target name="compress" depends="build" description="compress javascript and css">
…
</target>
HUGE / Ant 9
4. Build Script (clean target)
<target name="clean" description="clean up">
<delete dir="${build}">
<include name="**/*"/>
</delete>
</target>
HUGE / Ant 10
5. Build Script (build target)
<copy todir="${build}">
<fileset dir="${src}" excludes="css/global/,css/weeks/,js/global/,js/weeks/" />
</copy>
<concat destfile="${build}/js/min/weeks.js">
<fileset dir="${src}/js/global/"/>
<fileset dir="${src}/js/weeks/"/>
</concat>
<concat destfile="${build}/css/min/weeks.css">
<fileset dir="${src}/css/global/"/>
<fileset dir="${src}/css/weeks/"/>
</concat>
HUGE / Ant 11
6. Build Script (build target)
<move file="${build}/inc/weeks/head-css-min.jsp"
tofile="${build}/inc/weeks/head-css.jsp"/>
<move file="${build}/inc/weeks/head-js-min.jsp"
tofile="${build}/inc/weeks/head-js.jsp"/>
HUGE / Ant 12
7. Build Script (head-css)
<%@ include file="inc/weeks/head-css.jsp" %>
<link rel="stylesheet" type="text/css" href="css/global/01-reset.css" />
<link rel="stylesheet" type="text/css" href="css/global/02-font.css" />
<link rel="stylesheet" type="text/css" href="css/global/03-global.css" />
<link rel="stylesheet" type="text/css" href="css/global/box.css" />
<link rel="stylesheet" type="text/css" href="css/global/footer.css" />
<link rel="stylesheet" type="text/css" href="css/global/header.css" />
<link rel="stylesheet" type="text/css" href="css/min/weeks.css" />
(head-css-min.jsp)
HUGE / Ant 13
8. Build Script (head-js)
<%@ include file="inc/weeks/head-js.jsp" %>
<script type="text/javascript" src="js/global/0_jquery-1.2.4.min.js"></script>
<script type="text/javascript" src="js/weeks/0_ui.core.min.js"></script>
<script type="text/javascript" src="js/weeks/1_ui.accordion.min.js"></script>
<script type="text/javascript" src="js/weeks/2_ui.tabs.min.js"></script>
<script type="text/javascript" src="js/min/weeks.js"></script>
(head-js-min.jsp)
HUGE / Ant 14
9. Build Script (compress target)
<mkdir dir="${build}/js/compress"/>
<yui-compressor warn="false“ munge="true“ jsSuffix=".js“ preserveallsemicolons="false“
fromdir="${build}/js" todir="${build}/js/compress">
</yui-compressor>
<copy todir="${build}/js">
<fileset dir="${build}/js/compress"/>
</copy>
<delete dir="${build}/js/compress"/>
HUGE / Ant 15
10. Build Script (compress target)
<mkdir dir="${build}/css/compress"/>
<yui-compressor warn="false” munge="true“ cssSuffix=".css"
fromdir="${build}/css“ todir="${build}/css/compress">
</yui-compressor>
<copy todir="${build}/css">
<fileset dir="${build}/css/compress"/>
</copy>
<delete dir="${build}/css/compress"/>
HUGE / Ant 16
Build Sucessfull