Maven项目中压缩js和Css代码
来源:互联网 发布:sql 字符串拼接 编辑:程序博客网 时间:2024/04/24 10:03
项目结构如图
我们的目的是将js中的js文件压缩到app.js,css中的base.css和main.css压缩到app.css中,步骤如下:
一、引入yuicompressor的依赖
<dependency> <groupId>com.yahoo.platform.yui</groupId> <artifactId>yuicompressor</artifactId> <version>2.3.6</version> <type>jar</type></dependency>
二、引入maven-antrun-plugin插件
<plugin> <groupId>org.<a target=_blank href="http://biancheng.dnbcw.info/apache/" style="color: rgb(0, 102, 204); text-decoration: none;">apache</a>.maven.plugins</groupId> <artifactId>maven-antrun-plugin</artifactId> <version>1.3</version> <executions> <execution> <id>compile</id> <phase>compile</phase> <configuration> <tasks> <property name="yuicompressor.jar" value="${maven.dependency.com.yahoo.platform.yui.yuicompressor.jar.path}"/> <ant antfile="yuicompress.xml" target="clean"/> </tasks> </configuration> <goals> <goal>run</goal> </goals> </execution> </executions></plugin>
三、编写ant脚本文件yuicompress.xml
<?xml version="1.0" encoding="utf-8"?><project name="MyProject" > <description>Javascritp build for Ant</description> <property name="webapp" location="${basedir}/src/main/webapp"/> <property name="css" location="${webapp}/css"/> <property name="js" location="${webapp}/js"/> <property name="build" location="${js}/build"/> <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, <a target=_blank href="http://biancheng.dnbcw.info/zhengzebiaodashi/" style="color: rgb(0, 102, 204); text-decoration: none;">正则表达式</a>替换,将DEBUG标识替换为空,在正式环境不处理DEBUG信息 注意设置文件的 encoding 属性,否则可能有乱码情况 关于ANT的详细文档,请看官方手册:http://ant.<a target=_blank href="http://biancheng.dnbcw.info/apache/" style="color: rgb(0, 102, 204); text-decoration: none;">apache</a>.org/manual/ - - - - - - - - - - - - - - - - - --> <target name="init"> <mkdir dir="${build}" /> </target> <target name="concat" depends="init"> <concat destfile="${build}/all.js" encoding="${charset}" outputencoding="${charset}"> <fileset dir="${js}"> <include name="*.js"/> </fileset> </concat> <concat destfile="${build}/all.css" encoding="${charset}" outputencoding="${charset}" > <path path="${css}/base.css"/> <path path="${css}/main.css"/> </concat> </target> <target name="compress" depends="concat"> <echo message="start compress" /> <<a target=_blank href="http://biancheng.dnbcw.info/java/" style="color: rgb(0, 102, 204); text-decoration: none;">java</a> jar="${yuicompressor.jar}" fork="true" failonerror="false"> <arg line="--type js --charset ${charset} --nomunge ${build}/all.js -o ${js}/app.js" /> </<a target=_blank href="http://biancheng.dnbcw.info/java/" style="color: rgb(0, 102, 204); text-decoration: none;">java</a>> <java jar="${yuicompressor.jar}" fork="true" failonerror="false"> <arg line="--type css --charset ${charset} ${build}/all.css -o ${css}/app.css" /> </java> <echo message="end compress" /> </target> <target name="clean" depends="compress"> <delete dir="${build}"/> </target></project>
四、运行compile命令,在控制台查看输出信息,success表示成功啦
0 0
- Maven项目中压缩js和Css代码
- 在项目中使用gulp压缩css和js
- maven YUI 压缩JS和CSS
- maven js css 压缩
- 压缩你的JS和CSS代码
- maven 压缩、合并 js, css
- maven 压缩、合并 js, css
- maven js css 自动压缩
- 使用yuicompressor-maven-plugin合并压缩js和css
- 使用maven插件压缩js和css文件
- Node.js压缩web项目中的js,css和图片
- 在ASP.NET WEBFORM项目中使用MVC4中的BundleConfig捆绑压缩JS和CSS
- maven yui插件压缩js,css
- maven实现JS+CSS自动压缩
- maven实现JS+CSS自动压缩
- gulp压缩js和css
- gulp压缩js和css
- webstorm 压缩js 和 css
- 将耳机和USB插孔设置在手机侧面的简直是脑残设计
- 矩阵快速幂求Fibonacci
- Oracle Sql 性能优化
- android linux层检测sd卡是否已经mount
- NET代码审查工具
- Maven项目中压缩js和Css代码
- Struts2返回JSON数据的具体应用范例
- java二维码生成与解析代码实现
- Qt v4l2显示摄像头图片
- oracle知识总结
- 利用Navicat数据迁移
- 百辆豪车聚集春熙路
- android Fragments详解五:与activity通讯
- swift的代码教程-ios文件管理类(FileOp)