前端js跟css的压缩合并之YUI-Compressor
前端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
++
+
+
——
+
+
+