maven中用yuicompressor和closure-compiler对js、css文件进行压缩
转载自:http://matychen.iteye.com/blog/1477350
项目采用maven构建的时候,需要压缩js,css等,网上找了相关资料,自己综合了下~
直接放代码:
- <!-- js压缩 -->
- <plugin>
- <groupId>net.alchim31.maven</groupId>
- <artifactId>yuicompressor-maven-plugin</artifactId>
- <version>1.3.0</version>
- <executions>
- <execution>
- <phase>install</phase>
- <goals>
- <goal>compress</goal>
- </goals>
- <configuration>
- <excludes>
- <exclude>**/*.min.js</exclude>
- <exclude>**/*-min.js</exclude>
- </excludes>
- <nosuffix>true</nosuffix>
- <linebreakpos>-1</linebreakpos>
- </configuration>
- </execution>
- </executions>
- </plugin>
- <!-- native2ascii -->
- <plugin>
- <groupId>org.codehaus.mojo</groupId>
- <artifactId>native2ascii-maven-plugin</artifactId>
- <version>1.0-beta-1</version>
- <executions>
- <execution>
- <phase>install</phase>
- <goals>
- <goal>native2ascii</goal>
- </goals>
- <configuration>
- <workDir>${project.build.directory}/${project.build.finalName}</workDir>
- <excludes>
- <exclude>**/*.css</exclude>
- </excludes>
- <includes>
- <include>resources/js/*.js</include>
- </includes>
- </configuration>
- </execution>
- </executions>
- </plugin>
更喜欢采用谷歌的closure-compiler + maven-antrun-plugin
- <plugin>
- <groupId>org.apache.maven.plugins</groupId>
- <artifactId>maven-dependency-plugin</artifactId>
- <version>2.4</version>
- <executions>
- <execution>
- <phase>validate</phase>
- <goals>
- <goal>copy</goal>
- </goals>
- <configuration>
- <artifactItems>
- <artifactItem>
- <groupId>com.google.javascript</groupId>
- <artifactId>closure-compiler</artifactId>
- <version>r1810</version>
- <type>jar</type>
- <overWrite>true</overWrite>
- <outputDirectory>${project.build.directory}/compressor</outputDirectory>
- <destFileName>closure-compiler.jar</destFileName>
- </artifactItem>
- <artifactItem>
- <groupId>com.yahoo.platform.yui</groupId>
- <artifactId>yuicompressor</artifactId>
- <version>2.4.6</version>
- <type>jar</type>
- <overWrite>true</overWrite>
- <outputDirectory>${project.build.directory}/compressor</outputDirectory>
- <destFileName>yuicompressor.jar</destFileName>
- </artifactItem>
- </artifactItems>
- </configuration>
- </execution>
- </executions>
- </plugin>
- <plugin>
- <groupId>org.apache.maven.plugins</groupId>
- <artifactId>maven-antrun-plugin</artifactId>
- <version>1.7</version>
- <executions>
- <execution>
- <phase>install</phase>
- <goals>
- <goal>run</goal>
- </goals>
- <configuration>
- <tasks>
- <echo message="开始压缩 JS 文件. 请耐心等待!" />
- <property name="yuicompressor" value="${project.build.directory}/compressor/yuicompressor.jar" />
- <property name="closure-compiler" value="${project.build.directory}/compressor/closure-compiler.jar" />
- <property name="css.compress.directory" value="${project.build.directory}/${project.build.finalName}/resources" />
- <property name="js.compress.directory" value="${css.compress.directory}/js" />
- <apply executable="java" parallel="false" failonerror="true" dest="${js.compress.directory}">
- <fileset dir="${js.compress.directory}" includes="**/*.js" />
- <arg line="-jar" />
- <arg path="${closure-compiler}" />
- <arg line="--warning_level DEFAULT" />
- <arg line="--compilation_level SIMPLE_OPTIMIZATIONS" />
- <arg line="--js" />
- <srcfile />
- <arg line="--js_output_file" />
- <targetfile />
- <mapper type="regexp" from="^(.*)\.(js)$" to="\1-min.\2" />
- </apply>
- <move todir="${js.compress.directory}">
- <fileset dir="${js.compress.directory}" includes="**/*.js" />
- <mapper type="regexp" from="^(.*)-min\.(js)$" to="\1.\2" />
- </move>
- <echo message="成功压缩 JS 文件" />
- <echo message="开始压缩 CSS 文件. 请耐心等待!" />
- <apply executable="java" parallel="false" failonerror="true" dest="${css.compress.directory}">
- <fileset dir="${css.compress.directory}" includes="**/*.css" />
- <arg line="-jar" />
- <arg path="${yuicompressor}" />
- <arg line="--charset UTF-8" />
- <arg value="--type"/>
- <arg value="css"/>
- <srcfile />
- <arg line="-o" />
- <targetfile />
- <mapper type="regexp" from="^(.*)\.(css)$" to="\1-min.\2" />
- </apply>
- <move todir="${css.compress.directory}">
- <fileset dir="${css.compress.directory}" includes="**/*.css" />
- <mapper type="regexp" from="^(.*)-min\.(css)$" to="\1.\2" />
- </move>
- <echo message="成功压缩 CSS 文件" />
- </tasks>
- </configuration>
- </execution>
- </executions>
- </plugin>
JQUERY 的压缩工具 uglifyjs版本的配置,必须要有nodejs环境 (executable="node")即在cmd中能够执行 node --version. uglifyjs可以在https://github.com/mishoo/UglifyJS 下载,下载后续稍稍修改bin/uglifyjs,把里面的
- var uglify = require("uglify-js")
修改为
- var uglify = require("./uglify-js");//或者 ../uglify-js
因为uglify-js默认是在bin目录外面的。
如需更新uglify的版本,每次覆盖相应文件,只修改上面文件即可。
- <echo message="开始压缩 JS 文件. 请耐心等待!" />
- <property name="uglifyjs" value="${project.build.directory}/compressor/uglify/uglifyjs" />
- <property name="yuicompressor" value="${project.build.directory}/compressor/yuicompressor.jar" />
- <property name="closure-compiler" value="${project.build.directory}/compressor/closure-compiler.jar" />
- <property name="css.compress.directory" value="${project.build.directory}/${project.build.finalName}/resources" />
- <property name="js.compress.directory" value="${css.compress.directory}/js" />
- <apply executable="node" parallel="false" failonerror="true" dest="${js.compress.directory}">
- <fileset dir="${js.compress.directory}" includes="**/*.js" />
- <arg line=" ${uglifyjs}" />
- <arg line=" --ascii" />
- <arg line=" -o" />
- <targetfile />
- <srcfile />
- <mapper type="regexp" from="^(.*)\.(js)$" to="\1-min.\2" />
- </apply>
- <move todir="${js.compress.directory}">
- <fileset dir="${js.compress.directory}" includes="**/*.js" />
- <mapper type="regexp" from="^(.*)-min\.(js)$" to="\1.\2" />
- </move>
maven中用yuicompressor和closure-compiler对js、css文件进行压缩的更多相关文章
- JS&CSS文件请求合并及压缩处理研究(五)
接上篇.在我们最终调用 @Html.RenderResFile(ResourceType.Script) 或者 @Html.RenderResFile(ResourceType.StyleSheet) ...
- iOS之在webView中引入本地html,image,js,css文件的方法 - sky//////////////////////////////////////ZZZZZZZZZZZZZZZ
iOS之在webView中引入本地html,image,js,css文件的方法 2014-12-08 20:00:16CSDN-sky_2016-点击数:10292 项目需求 最近开发的项 ...
- ASP.NET MVC 4 Optimization的JS/CSS文件动态合并及压缩
JS/CSS文件的打包合并(Bundling)及压缩(Minification)是指将多个JS或CSS文件打包合并成一个文件,并在网站发布之后进行压缩,从而减少HTTP请求次数,提高网络加载速度和页面 ...
- nginx设置反向代理后,页面上的js css文件无法加载
问题现象: nginx配置反向代理后,网页可以正常访问,但是页面上的js css文件无法加载,页面样式乱了. (1)nginx配置如下: (2)域名访问:js css文件无法加载: (3)IP访问:j ...
- Web性能优化之动态合并JS/CSS文件并缓存客户端
来源:微信公众号CodeL 在Web开发过程中,会产生很多的js/css文件,传统的引用外部文件的方式会产生多次的http请求,从而加重服务器负担且网页加载缓慢,如何在一次请求中将多个文件一次加载出来 ...
- 前端js,css文件合并三种方式,bat命令
前端js,css文件合并三种方式,bat命令 前端js文件该如何合并三个方式如下:1. 一个大文件,所有js合并成一个大文件,所有页面都引用它.2. 各个页面大文件,各自页面合并生成自己所需js的大文 ...
- javascript异步延时载入及推断是否已载入js/css文件
<html> <head> <script type="text/javascript"> /**======================= ...
- MVC打包压缩JS&CSS文件调试时过滤了一些文件
BundleTable.这个确实是比较好用,打包并压缩了CSS,使之加载时减少流量. 但是在调试的时候会疑问为何有很多JS,CSS文件无法打包,其实是因为调试时VS自动过滤了如下文件: 后台跟踪了 ...
- 开箱即用 - Grunt合并和压缩 js,css 文件
js,css 文件合并与压缩 Grunt 是前端自动化构建工具,类似webpack. 它究竟有多强悍,请看它的 介绍. 这里只演示如何用它的皮毛功能:文件合并与压缩. 首先说下js,css 合并与压缩 ...
- js动态加载js css文件,可以配置文件后辍,防止浏览器缓存
js的引用,在浏览器,或微信上访问经常会遇到文件改了,但就是没有更新的问题,使用此函数可以轻松解决缓存问题只需要把js的引用方式改为使用此函数加载即可 源码如下: /** * js动态加载js css ...
随机推荐
- Struts2文件上传带进度条,虽然不是很完美
好久没有写东西,最近在做个项目,要用到文件h 传的,以前虽然也做上传,但是总觉得不好用 ,现在和队友合作做了一个带进度条的上传,觉得还行~~和大家分享一下. 首先说一下大概是这样实现的,在我们平时的上 ...
- Centos6配置开启FTP Server
vsftpd作为FTP服务器,在Linux系统中是非常常用的.下面我们介绍如何在centos系统上安装vsftp. 什么是vsftpd vsftpd是一款在Linux发行版中最受推崇的FTP服务器程序 ...
- 4-1:实现tee命令
#include <stdio.h> #include <sys/stat.h> #include <fcntl.h> #include <unistd.h& ...
- 如何遍历一个文件夹(C语言实现)
#include<io.h> #include<stdio.h> int main() { long Handle; struct _finddata_t FileInfo; ...
- LintCode-71.二叉树的锯齿形层次遍历
二叉树的锯齿形层次遍历 给出一棵二叉树,返回其节点值的锯齿形层次遍历(先从左往右,下一层再从右往左,层与层之间交替进行) 样例 给出一棵二叉树 {3,9,20,#,#,15,7}, 返回其锯齿形的层次 ...
- iOS开发NS_ENUM和NS_OPTIONS区别
OC里枚举的两种类型.NS_ENUM和NS_OPTIONS本质上是一样的都是枚举. typedef NS_ENUM(NSInteger, UIViewAnimationTransition) { UI ...
- 移动端的picker参考vux
参考vux移动端的ui组件,做了一个picker,测试在微信,uc主流浏览器能够正常工作.而在华为浏览器根本不能使用.而测试了vux的原有picker组件,发现在华为自带浏览器中,效果依然能够实现. ...
- MVP开发模式的理解
1.MVP是什么 如果从层次关系来讲,MVP属于Presentation层的设计模式.对于一个UI模块来说,它的所有功能被分割为三个部分,分别通过Model.View和Presenter来承载.Mod ...
- shit antd & Merry Christmas bug
shit antd & Merry Christmas bug https://github.com/ant-design/ant-design/issues/13098 antd 玩大了? ...
- 2016 China Final H - Great Cells
/************************************************************************* > File Name: H.cpp > ...