This document provides a step-by-step guide for using Ant, an open-source build automation tool for Java projects. It outlines how to install Ant and the YUI Compressor plugin for JavaScript and CSS minification. The guide then describes a sample folder structure and build script that defines targets for cleaning, compiling, concatenating files, and minifying assets to optimize a website for production.

1. 06/03/09 HUGE / ParentsConnect / HUGE 45 Main Street, 2nd Floor NY NY 11201 718.625.4843 www.hugeinc.com step-by-step guide Ant Build Tool May 22nd, 2008

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&quot; default=&quot;build&quot; basedir=&quot;.&quot;> <taskdef name=&quot;yui-compressor&quot; classname=&quot;net.noha.tools.ant.yuicompressor.tasks.YuiCompressorTask&quot;></taskdef> <property name=&quot;src&quot; location=&quot; wwwroot &quot;/> <property name=&quot;build&quot; location=&quot; wwwroot-compressed &quot;/> ... </project> HUGE / Ant

7. 2. Build Script <target name=&quot;build&quot; description=&quot;generate the distribution&quot;> … </target> HUGE / Ant

8. 3. Build Script <target name=&quot;compress&quot; depends=&quot;build&quot; description=&quot;compress javascript and css&quot;> … </target> HUGE / Ant

9. 4. Build Script (clean target) <target name=&quot;clean&quot; description=&quot;clean up&quot;> <delete dir=&quot;${build}&quot;> <include name=&quot;**/*&quot;/> </delete> </target> HUGE / Ant

10. 5. Build Script (build target) <copy todir=&quot;${build}&quot;> <fileset dir=&quot;${src}&quot; excludes=&quot;css/global/,css/weeks/,js/global/,js/weeks/&quot; /> </copy> <concat destfile=&quot;${build}/js/min/weeks.js&quot;> <fileset dir=&quot;${src}/js/global/&quot;/> <fileset dir=&quot;${src}/js/weeks/&quot;/> </concat> <concat destfile=&quot;${build}/css/min/weeks.css&quot;> <fileset dir=&quot;${src}/css/global/&quot;/> <fileset dir=&quot;${src}/css/weeks/&quot;/> </concat> HUGE / Ant

11. 6. Build Script (build target) <move file=&quot;${build}/inc/weeks/ head-css-min.jsp &quot; tofile=&quot;${build}/inc/weeks/ head-css.jsp &quot;/> <move file=&quot;${build}/inc/weeks/ head-js-min.jsp &quot; tofile=&quot;${build}/inc/weeks/ head-js.jsp &quot;/> HUGE / Ant

12. 7. Build Script (head-css) <%@ include file=&quot;inc/weeks/head-css.jsp&quot; %> <link rel=&quot;stylesheet&quot; type=&quot;text/css&quot; href=&quot;css/global/01-reset.css&quot; /> <link rel=&quot;stylesheet&quot; type=&quot;text/css&quot; href=&quot;css/global/02-font.css&quot; /> <link rel=&quot;stylesheet&quot; type=&quot;text/css&quot; href=&quot;css/global/03-global.css&quot; /> <link rel=&quot;stylesheet&quot; type=&quot;text/css&quot; href=&quot;css/global/box.css&quot; /> <link rel=&quot;stylesheet&quot; type=&quot;text/css&quot; href=&quot;css/global/footer.css&quot; /> <link rel=&quot;stylesheet&quot; type=&quot;text/css&quot; href=&quot;css/global/header.css&quot; /> <link rel=&quot;stylesheet&quot; type=&quot;text/css&quot; href=&quot;css/min/weeks.css&quot; /> (head-css-min.jsp) HUGE / Ant

13. 8. Build Script (head-js) <%@ include file=&quot;inc/weeks/head-js.jsp&quot; %> <script type=&quot;text/javascript&quot; src=&quot;js/global/0_jquery-1.2.4.min.js&quot;></script> <script type=&quot;text/javascript&quot; src=&quot;js/weeks/0_ui.core.min.js&quot;></script> <script type=&quot;text/javascript&quot; src=&quot;js/weeks/1_ui.accordion.min.js&quot;></script> <script type=&quot;text/javascript&quot; src=&quot;js/weeks/2_ui.tabs.min.js&quot;></script> <script type=&quot;text/javascript&quot; src=&quot;js/min/weeks.js&quot;></script> (head-js-min.jsp) HUGE / Ant

14. 9. Build Script (compress target) <mkdir dir=&quot; ${build}/js/compress &quot;/> <yui-compressor warn=&quot;false“ munge=&quot;true“ jsSuffix=&quot;.js“ preserveallsemicolons=&quot;false“ fromdir=&quot; ${build}/js &quot; todir=&quot; ${build}/js/compress &quot;> </yui-compressor> <copy todir=&quot; ${build}/js &quot;> <fileset dir=&quot; ${build}/js/compress &quot;/> </copy> <delete dir=&quot; ${build}/js/compress &quot;/> HUGE / Ant

15. 10. Build Script (compress target) <mkdir dir=&quot; ${build}/css/compress &quot;/> <yui-compressor warn=&quot;false” munge=&quot;true“ cssSuffix=&quot;.css&quot; fromdir=&quot; ${build}/css “ todir=&quot; ${build}/css/compress &quot;> </yui-compressor> <copy todir=&quot; ${build}/css &quot;> <fileset dir=&quot; ${build}/css/compress &quot;/> </copy> <delete dir=&quot; ${build}/css/compress &quot;/> HUGE / Ant

16. Build Sucessfull HUGE / Ant