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 ...
随机推荐
- 理解glance
摘要: 本节介绍 OpenStack Image 服务 Glance 的基本概念. OpenStack 由 Glance 提供 Image 服务. 理解 Image 要理解 Image Service ...
- php常用方法汇总
xml格式转成array <?php $str='<xml><node><![CDATA[content]]></node></xml> ...
- 浅谈蓝牙低功耗(BLE)的几种常见的应用场景及架构(转载)
转载来至beautifulzzzz,网址http://www.cnblogs.com/zjutlitao/,推荐学习 蓝牙在短距离无线通信领域占据举足轻重的地位—— 从手机.平板.PC到车载设备, 到 ...
- Python中对变量是否为None的判断
三种主要的写法有: 第一种:if X is None; 第二种:if not X: 当X为None, False, 空字符串"", 0, 空列表[], 空字典{}, 空元组()这 ...
- python学习笔记01:安装python
下载python: 从从https://www.python.org/downloads/下载python,根据操作系统的不同,选择不同的版本下载.注意:linux系统大多预装了python,可以直接 ...
- 在LaTex中插入电路图的方法(插入图片)
主要的需求是要在文档中插入电路图. 有两种方法,一种是直接在LaTex中绘制电路图,使用的库主要是circ和circuitikz 另一种是在其他软件上绘制电路图,转成特定图像格式后,在Latex中插入 ...
- Windows 7中安装Solr7
最新忙里偷闲,研究一下了Lucene.Net,发现操作比较繁琐,同比相似的功能,感觉Solr比较简单,容易使用.不过由于Solr使用的是Java的环境,对于.Net开发的人员来说,还是比较陌生,搭配环 ...
- 【Linux】- CentOS 7 安装.NET Core 2.1
添加dotnet产品Feed 在安装.NET Core之前,您需要注册Microsoft产品Feed. 这只需要做一次. 首先,注册Microsoft签名密钥,然后添加Microsoft产品Feed. ...
- Shell中sort-cut-wc详解
sort sort 命令对 File 参数指定的文件中的行排序,并将结果写到标准输出.如果 File 参数指定多个文件,那么 sort 命令将这些文件连接起来,并当作一个文件进行排序. sort语法 ...
- 限制玻尔兹曼机(Restricted Boltzmann Machine)RBM
假设有一个二部图,每一层的节点之间没有连接,一层是可视层,即输入数据是(v),一层是隐藏层(h),如果假设所有的节点都是随机二值变量节点(只能取0或者1值)同时假设全概率分布满足Boltzmann 分 ...