版权所有，转载请注明来源http://gogo1217.iteye.com，违者必究！

?

????? 在做WEB企业应用时，都会涉及到的CSS和JS的编写。随着项目的推进，这些文件如果写在同一个文件中，造成维护的困难，找一个需要修改的地方很麻烦。所以，好的做法是根据JS的功能划分为多个小的JS文件，页面通过某种方式间接引用这些小的JS文件。

?????? 这里推荐yahoo的一个js/css压缩工具YUI Compressor ,目前最新版本是2.4.6。

1.下载文件后，新建工程目录如下所示：

2.ant脚本及配置文件如下：

ant脚本build.xml文件代码如下：

由于在实际项目中，我们需要对不同的目录的资源文件压缩，因此一般通过循环完成多个目录的压缩。在本配置文件中，使用了额外的一个ant任务扩展包ant-contrib,下载地址为：http://ant-contrib.sourceforge.net/. 该包在ant的基础上扩展了多个自定义任务。

<?xml version="1.0" encoding="UTF-8"?>
<project name="yui-compressor-demo" basedir="." default="yui-compress">
	<description>
		yui-compressor-demo create by gogo1217 2011-9-4
		http://gogo1217.iteye.com/
	</description>

	<!--导入配置文件 -->
	<property file="build.properties" />
	<tstamp>
		<format property="build.time" pattern="yyyy-MM-dd-HH-mm" />
	</tstamp>

	<!--设置ant-contrib.jar用于逻辑判断 -->
	<taskdef resource="net/sf/antcontrib/antlib.xml">
		<classpath>
			<pathelement location="${lib.build.antcontrib}" />
		</classpath>
	</taskdef>

	<!--设置编译环境 -->
	<path id="build.classpath">
		<fileset dir="${lib.build}">
			<include name="*.jar" />
		</fileset>
	</path>

	<!-- 创建build相关目录 -->
	<target name="init">
		<delete dir="${deploy.dir}" />
		<mkdir dir="${deploy.resource}" />
	</target>

	<!--压缩合并css、js文件 -->
	<target name="yui-compress" depends="init">
		<!-- 由于需要对css和js压缩，因此使用antcontrib ant扩展来做循环判断 -->
		<for list="${resources.include}" param="resoucesPath">
			<!-- param表示在迭代的变量,使用时为@{resourcesPath} -->
			<sequential>
				<!--创建资源目录 -->
				<mkdir dir="${deploy.resource}/@{resoucesPath}/" />
				<!--合并小文件为一个资源文件 -->
				<concat
					destfile="${deploy.resource}/@{resoucesPath}/demo-src.@{resoucesPath}"
					fixlastline="true" encoding="UTF-8">
					<fileset dir="${resource.dir}/@{resoucesPath}">
						<exclude name="demo.@{resoucesPath}" />
					</fileset>
				</concat>
				<!--压缩资源文件 -->
				<apply executable="java" parallel="false" failonerror="true">
					<fileset dir="${deploy.resource}/@{resoucesPath}">
						<include name="*.@{resoucesPath}" />
					</fileset>
					<arg line="-jar" />
					<arg path="${lib.build.yuicompressor}" />
					<arg line="--charset UTF-8" />
					<srcfile />
					<arg line="-o" />
					<mapper type="glob" from="*.@{resoucesPath}"
						to="${deploy.resource}/@{resoucesPath}/demo-min.@{resoucesPath}" />
					<targetfile />
				</apply>
			</sequential>
		</for>
	</target>
</project>

?build.properties配置文件代码如下：

##工程根目录
project.dir=..

##app目录
resource.dir=${project.dir}/resources
resources.include=css,js

##依赖包
lib.dir = ${project.dir}/lib
lib.build=${lib.dir}/build
lib.build.yuicompressor= ${lib.dir}/build/yuicompressor-2.4.6.jar
lib.build.antcontrib= ${lib.dir}/build/ant-contrib-1.0b3.jar

#发布目录
deploy.dir=${project.dir}/deploy
deploy.resource=${deploy.dir}/resources

? 3.在build.xml上右键，选择“Run-As”-》“Ant Build”，控制台结果为：

4.工程中新建了目录deploy及相关的子目录如下所示：

其中 demo-src.css和demo-src.js为压缩后的源文件，发布时，带上源文件便于使用者能覆盖重写和查找问题。demo-min.css和demo-min.js为压缩后的代码。

demo-src.js源码如下:

/**
 * @description mi命名空间
 * @namespace mi命名空间
 * @version 0.1