前端js和css的压缩合并之YUI-Compressor

me：注：早已经迁往github上了。

地址：https://github.com/yui/yuicompressor/blob/master/README.md

From：http://www.everycoding.com/coding/80.html

YUI Compressor Maven插件压缩 js、css并输出war包

YUI Compressor是一款非常强大JS混淆和压缩工具。目前很多Javascript框架都使用YUI Compressor进行了代码压缩。据说鼎鼎有名的Jquery框架也是使用YUI Compressor进行压缩。YUI Compressor压缩的好处是不仅大大减少js、css的体积，同时在对javascript代码的混淆压缩中对属性命名的替换，使得压缩过的js不易阅读，能起到源码的保护作用。本文主要介绍YUI Compressor的使用方法和技巧。

一、在Maven pom.xml文件中，添加YUI Compressor 插件。代码如下：

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52

< plugin >      < groupId >net.alchim31.maven</ groupId >      < artifactId >yuicompressor-maven-plugin</ artifactId >      < version >1.3.0</ version >      < executions >          < execution >              < goals >                  < goal >compress</ goal >              </ goals >          </ execution >      </ executions >      < configuration >          < skip >false</ skip >          <!-- 读取js,css文件采用UTF-8编码 -->          < encoding >UTF-8</ encoding >          < jswarn >false</ jswarn >          <!-- 若存在已压缩的文件，会先对比源文件是否有改动。有改动便压缩，无改动就不压缩 -->          < force >false</ force >          <!-- <suffix>.min</suffix> -->          < nosuffix >true</ nosuffix >          <!-- 在指定的列号后插入新行 -->          < linebreakpos >-1</ linebreakpos >          <!-- 压缩之前先执行聚合文件操作 -->          < preProcessAggregates >true</ preProcessAggregates >          < aggregations >              < aggregation >                  < removeIncluded >true</ removeIncluded >                  < insertNewLine >true</ insertNewLine >                  < inputDir >${project.build.directory}/${project.build.finalName}/resources/static/js                  </ inputDir >                  < output >${project.build.directory}/${project.build.finalName}/build/js/basic.min.js                  </ output >                  < includes >                      < include >jquery-1.7.2.js</ include >                      < include >everycoding.js</ include >                      < include >front.js</ include >                  </ includes >              </ aggregation >              < aggregation >                  < insertNewLine >true</ insertNewLine >                  < inputDir >${project.build.directory}/${project.build.finalName}/resources/static/css                  </ inputDir >                  < output >${project.build.directory}/${project.build.finalName}/build/css/basic.min.css                  </ output >                  < includes >                      < include >common.css</ include >                      < include >front.css</ include >                  </ includes >              </ aggregation >          </ aggregations >      </ configuration > </ plugin >

aggregations：管理需要分类合并的Js、Css

二、使用Maven命令执行压缩：

1	mvn yuicompressor:compress

三、打war时，如果需要排除未压缩的js、css文件，可使用如下方法：

1 2 3 4 5 6 7 8

< plugin >      < groupId >org.apache.maven.plugins</ groupId >      < artifactId >maven-war-plugin</ artifactId >      < version >2.4</ version >      < configuration >          < warSourceExcludes >**/*.js,**/*.css</ warSourceExcludes >      </ configuration > </ plugin >

YUI Compressor官网：http://yui.github.io/yuicompressor/

相关配置参数说明：http://alchim31.free.fr/mvnsites/yuicompressor-maven-plugin/compress-mojo.html

++

+
+
——
+
+
+