ant+yuicompressor 合并、压缩脚本与样式

简介: 我使用的是Eclipse编写build.xml,你可以用其它的编辑器,前提是你已经安装了ant     将js目录下的所有.js合并为一个all.js,调用yuicompressor压缩成一个core.js文件。

我使用的是Eclipse编写build.xml,你可以用其它的编辑器,前提是你已经安装了ant

 

未命名

 

将js目录下的所有.js合并为一个all.js,调用yuicompressor压缩成一个core.js文件。

<?xml version="1.0" encoding="UTF-8"?>
<project name="Javascritp_build" default="clean" basedir="../">
	
	<description>Javascritp build for Ant</description>
	
	<property name="src" location="js"/>
	<property name="build" location="build"/>
	<property name="target" location="result"/>
	<property name="lib" location="lib"/>
	<property name="charset" value="utf-8"/>
	
	<!-- - - - - - - - - - - - - - - - - - 
	这个 ant 配置文件要经过4个流程:
	1、target init 进行初始化处理,创建一个目录build,用于暂存文件;
	2、target concat 合并两个 js 文件,放到 build 目录下;
	3、target compress 调用 Yui Compressor 对合并后的 js 进行压缩
	4、target clean 进行清理动作,删除生成的 build 目录

	ANT标签和属性解释:
	project 的 default 对应某个 target 的 name 值,表示默认执行哪个步骤;
	target 的 depends 对应其他某些 target 的 name 属性,表示依赖性;
	${name} 可以引用 property 中定义的值。
	mkdir 标签创建一个目录
	replaceregexp, 正则表达式替换,将DEBUG标识替换为空,在正式环境不处理DEBUG信息
	注意设置文件的 encoding 属性,否则可能有乱码情况

	关于ANT的详细文档,请看官方手册:http://ant.apache.org/manual/        
         - - - - - - - - - - - - - - - - - -->
    <target name="init">
    	<mkdir dir="${build}" />
    </target>
	
	<target name="concat" depends="init">
		<concat destfile="${build}/all.js" encoding="${charset}" outputencoding="${charset}">
			<path path="${src}/core.js" />
			<path path="${src}/g.js" />
			<path path="${src}/nav.js" />
		</concat>
		
		<!-- - - - - - - - - - - - - - - - - - 
			replaceregexp的说明	http://ant.apache.org/manual/Tasks/replaceregexp.html
		 - - - - - - - - - - - - - - - - - -->
		
		<replaceregexp match="DEBUG" replace="" flags="g" byline="true" file="${build}/all.js" encoding="${charset}" />
	</target>
	
	<!-- - - - - - - - - - - - - - - - - - 
		YUICompressor参数 http://developer.yahoo.com/yui/compressor/#work
		
		通用参数:
		    -h, \-\-help                 显示帮助信息
		   \-\-type <js|css>            指定输入文件的文件类型
		   \-\-charset <charset>        指定读取输入文件使用的编码
		   \-\-line-break <column>      在指定的列后插入一个 line-bread 符号
		   \-v, \-\-verbose              显示info和warn级别的信息
		   -o <file>                  指定输出文件。默认输出是控制台。
		
		JavaScript专用参数:
		     \-\-nomunge                  只压缩, 不对局部变量进行混淆。
		   \-\-preserve-semi            保留所有的分号。
		   \-\-disable-optimizations    禁止优化。
	- - - - - - - - - - - - - - - - - -->
	<target name="compress" depends="concat">
		<echo message="start compress" />
		<java jar="${lib}/yuicompressor-2.4.2.jar" fork="true" failonerror="false">
			<arg line="--type js --charset ${charset} --nomunge ${build}/all.js -o ${target}/core.js" />
		</java>
		<echo message="end compress" />
	</target>
		
	<target name="clean" depends="compress">
		<delete dir="${build}"/>
	</target>
	
</project>

 

 

右击build.xml,然后选中Run As ---> Ant build,如果运行成功,控制台上将出现如下的信息:

 

Buildfile: C:\Java_app\JavaTest\WebRoot\WEB-INF\ant-build\build.xml
init:
    [mkdir] Created dir: C:\Java_app\JavaTest\WebRoot\WEB-INF\build
concat:
compress:
     [echo] start compress
     [echo] end compress
clean:
   [delete] Deleting directory C:\Java_app\JavaTest\WebRoot\WEB-INF\build
BUILD SUCCESSFUL
Total time: 1 second

 

 

未命名

 

 

可以看这里了解关于ant+JSLint的使用  www.rabbler.org/archives/40

目录
相关文章
|
4月前
|
JavaScript 前端开发
nodejs实现解析chm文件列表,无需转换为PDF文件格式,在线预览chm文件以及目录,不依赖任何网页端插件
nodejs实现解析chm文件列表,无需转换为PDF文件格式,在线预览chm文件以及目录,不依赖任何网页端插件
|
4月前
|
前端开发
解决VScode在保存less文件时,自动生成对应的css文件以及安装Easy less之后,计算式子不显示结果的问题
解决VScode在保存less文件时,自动生成对应的css文件以及安装Easy less之后,计算式子不显示结果的问题
合并多个文件的内容到一个文件
合并多个文件的内容到一个文件
|
4月前
|
JavaScript 前端开发
Gulp 打包压缩 js 文件到指定目录详细流程(修改文件名与后缀)
Gulp 打包压缩 js 文件到指定目录详细流程(修改文件名与后缀)
25 0
|
9月前
ant Table表格的一些常用的小功能以及常见的报错解决方法
ant Table表格的一些常用的小功能以及常见的报错解决方法
42 0
在vuecli3怎么压缩代码以及打包怎么去除console.log?
在vuecli3怎么压缩代码以及打包怎么去除console.log?
91 0
|
前端开发
VSCode使less文件实时转换成css代码【扩展插件(Easy LESS)】
VSCode使less文件实时转换成css代码【扩展插件(Easy LESS)】
VSCode使less文件实时转换成css代码【扩展插件(Easy LESS)】
|
JavaScript 前端开发
requireJs压缩合并路径问题
随着前端开发的重要性,以及业务的复杂性,前端的模块化开发也被大众所接收,最常见的js框架requireJs,一个js文件对应一个模块,方便开发人员调试与维护,但是一个文件对应一个模块增加了http请求,降低了网站的性能。幸运的是requireJs提供了压缩工具r.js(点击下载),r.js需要node(Node 0.4.0 或更高版本,点击下载)环境支持,安装完node就可以在命令行里对前端代码进行优化了。
requireJs压缩合并路径问题
|
前端开发 JavaScript 数据格式
gulp之自动化静态资源压缩合并加版本号
gulp之自动化压缩合并加版本号 这个方案主要是为了实现js/css/image的压缩合并、自动添加版本号、自动加浏览器前缀和压缩html。 先把下面这里插件 npm i (插件名) -D 安装到项目环境内 gulp-sequence //顺序执行任务 gulp-csso //css压缩 gulp...
1813 0