转载自:http://matychen.iteye.com/blog/1477350

项目采用maven构建的时候,需要压缩js,css等,网上找了相关资料,自己综合了下~ 



直接放代码:

  1. <!-- js压缩 -->
  2. <plugin>
  3. <groupId>net.alchim31.maven</groupId>
  4. <artifactId>yuicompressor-maven-plugin</artifactId>
  5. <version>1.3.0</version>
  6. <executions>
  7. <execution>
  8. <phase>install</phase>
  9. <goals>
  10. <goal>compress</goal>
  11. </goals>
  12. <configuration>
  13. <excludes>
  14. <exclude>**/*.min.js</exclude>
  15. <exclude>**/*-min.js</exclude>
  16. </excludes>
  17. <nosuffix>true</nosuffix>
  18. <linebreakpos>-1</linebreakpos>
  19. </configuration>
  20. </execution>
  21. </executions>
  22. </plugin>
  23. <!-- native2ascii -->
  24. <plugin>
  25. <groupId>org.codehaus.mojo</groupId>
  26. <artifactId>native2ascii-maven-plugin</artifactId>
  27. <version>1.0-beta-1</version>
  28. <executions>
  29. <execution>
  30. <phase>install</phase>
  31. <goals>
  32. <goal>native2ascii</goal>
  33. </goals>
  34. <configuration>
  35. <workDir>${project.build.directory}/${project.build.finalName}</workDir>
  36. <excludes>
  37. <exclude>**/*.css</exclude>
  38. </excludes>
  39. <includes>
  40. <include>resources/js/*.js</include>
  41. </includes>
  42. </configuration>
  43. </execution>
  44. </executions>
  45. </plugin>

更喜欢采用谷歌的closure-compiler + maven-antrun-plugin

  1. <plugin>
  2. <groupId>org.apache.maven.plugins</groupId>
  3. <artifactId>maven-dependency-plugin</artifactId>
  4. <version>2.4</version>
  5. <executions>
  6. <execution>
  7. <phase>validate</phase>
  8. <goals>
  9. <goal>copy</goal>
  10. </goals>
  11. <configuration>
  12. <artifactItems>
  13. <artifactItem>
  14. <groupId>com.google.javascript</groupId>
  15. <artifactId>closure-compiler</artifactId>
  16. <version>r1810</version>
  17. <type>jar</type>
  18. <overWrite>true</overWrite>
  19. <outputDirectory>${project.build.directory}/compressor</outputDirectory>
  20. <destFileName>closure-compiler.jar</destFileName>
  21. </artifactItem>
  22. <artifactItem>
  23. <groupId>com.yahoo.platform.yui</groupId>
  24. <artifactId>yuicompressor</artifactId>
  25. <version>2.4.6</version>
  26. <type>jar</type>
  27. <overWrite>true</overWrite>
  28. <outputDirectory>${project.build.directory}/compressor</outputDirectory>
  29. <destFileName>yuicompressor.jar</destFileName>
  30. </artifactItem>
  31. </artifactItems>
  32. </configuration>
  33. </execution>
  34. </executions>
  35. </plugin>
  36. <plugin>
  37. <groupId>org.apache.maven.plugins</groupId>
  38. <artifactId>maven-antrun-plugin</artifactId>
  39. <version>1.7</version>
  40. <executions>
  41. <execution>
  42. <phase>install</phase>
  43. <goals>
  44. <goal>run</goal>
  45. </goals>
  46. <configuration>
  47. <tasks>
  48. <echo message="开始压缩 JS 文件. 请耐心等待!" />
  49. <property name="yuicompressor" value="${project.build.directory}/compressor/yuicompressor.jar" />
  50. <property name="closure-compiler" value="${project.build.directory}/compressor/closure-compiler.jar" />
  51. <property name="css.compress.directory" value="${project.build.directory}/${project.build.finalName}/resources" />
  52. <property name="js.compress.directory" value="${css.compress.directory}/js" />
  53. <apply executable="java" parallel="false" failonerror="true" dest="${js.compress.directory}">
  54. <fileset dir="${js.compress.directory}" includes="**/*.js" />
  55. <arg line="-jar" />
  56. <arg path="${closure-compiler}" />
  57. <arg line="--warning_level DEFAULT" />
  58. <arg line="--compilation_level SIMPLE_OPTIMIZATIONS" />
  59. <arg line="--js" />
  60. <srcfile />
  61. <arg line="--js_output_file" />
  62. <targetfile />
  63. <mapper type="regexp" from="^(.*)\.(js)$" to="\1-min.\2" />
  64. </apply>
  65. <move todir="${js.compress.directory}">
  66. <fileset dir="${js.compress.directory}" includes="**/*.js" />
  67. <mapper type="regexp" from="^(.*)-min\.(js)$" to="\1.\2" />
  68. </move>
  69. <echo message="成功压缩 JS 文件" />
  70. <echo message="开始压缩 CSS 文件. 请耐心等待!" />
  71. <apply executable="java" parallel="false" failonerror="true" dest="${css.compress.directory}">
  72. <fileset dir="${css.compress.directory}" includes="**/*.css" />
  73. <arg line="-jar" />
  74. <arg path="${yuicompressor}" />
  75. <arg line="--charset UTF-8" />
  76. <arg value="--type"/>
  77. <arg value="css"/>
  78. <srcfile />
  79. <arg line="-o" />
  80. <targetfile />
  81. <mapper type="regexp" from="^(.*)\.(css)$" to="\1-min.\2" />
  82. </apply>
  83. <move todir="${css.compress.directory}">
  84. <fileset dir="${css.compress.directory}" includes="**/*.css" />
  85. <mapper type="regexp" from="^(.*)-min\.(css)$" to="\1.\2" />
  86. </move>
  87. <echo message="成功压缩 CSS 文件" />
  88. </tasks>
  89. </configuration>
  90. </execution>
  91. </executions>
  92. </plugin>

JQUERY 的压缩工具 uglifyjs版本的配置,必须要有nodejs环境 (executable="node")即在cmd中能够执行 node --version. uglifyjs可以在https://github.com/mishoo/UglifyJS 下载,下载后续稍稍修改bin/uglifyjs,把里面的

  1. var uglify = require("uglify-js")

修改为

  1. var uglify = require("./uglify-js");//或者 ../uglify-js

因为uglify-js默认是在bin目录外面的。 



如需更新uglify的版本,每次覆盖相应文件,只修改上面文件即可。

  1. <echo message="开始压缩 JS 文件. 请耐心等待!" />
  2. <property name="uglifyjs" value="${project.build.directory}/compressor/uglify/uglifyjs" />
  3. <property name="yuicompressor" value="${project.build.directory}/compressor/yuicompressor.jar" />
  4. <property name="closure-compiler" value="${project.build.directory}/compressor/closure-compiler.jar" />
  5. <property name="css.compress.directory" value="${project.build.directory}/${project.build.finalName}/resources" />
  6. <property name="js.compress.directory" value="${css.compress.directory}/js" />
  7. <apply executable="node" parallel="false" failonerror="true" dest="${js.compress.directory}">
  8. <fileset dir="${js.compress.directory}" includes="**/*.js" />
  9. <arg line=" ${uglifyjs}" />
  10. <arg line=" --ascii" />
  11. <arg line=" -o" />
  12. <targetfile />
  13. <srcfile />
  14. <mapper type="regexp" from="^(.*)\.(js)$" to="\1-min.\2" />
  15. </apply>
  16. <move todir="${js.compress.directory}">
  17. <fileset dir="${js.compress.directory}" includes="**/*.js" />
  18. <mapper type="regexp" from="^(.*)-min\.(js)$" to="\1.\2" />
  19. </move>

maven中用yuicompressor和closure-compiler对js、css文件进行压缩的更多相关文章

  1. JS&CSS文件请求合并及压缩处理研究(五)

    接上篇.在我们最终调用 @Html.RenderResFile(ResourceType.Script) 或者 @Html.RenderResFile(ResourceType.StyleSheet) ...

  2. iOS之在webView中引入本地html,image,js,css文件的方法 - sky//////////////////////////////////////ZZZZZZZZZZZZZZZ

    iOS之在webView中引入本地html,image,js,css文件的方法   2014-12-08 20:00:16CSDN-sky_2016-点击数:10292     项目需求 最近开发的项 ...

  3. ASP.NET MVC 4 Optimization的JS/CSS文件动态合并及压缩

    JS/CSS文件的打包合并(Bundling)及压缩(Minification)是指将多个JS或CSS文件打包合并成一个文件,并在网站发布之后进行压缩,从而减少HTTP请求次数,提高网络加载速度和页面 ...

  4. nginx设置反向代理后,页面上的js css文件无法加载

    问题现象: nginx配置反向代理后,网页可以正常访问,但是页面上的js css文件无法加载,页面样式乱了. (1)nginx配置如下: (2)域名访问:js css文件无法加载: (3)IP访问:j ...

  5. Web性能优化之动态合并JS/CSS文件并缓存客户端

    来源:微信公众号CodeL 在Web开发过程中,会产生很多的js/css文件,传统的引用外部文件的方式会产生多次的http请求,从而加重服务器负担且网页加载缓慢,如何在一次请求中将多个文件一次加载出来 ...

  6. 前端js,css文件合并三种方式,bat命令

    前端js,css文件合并三种方式,bat命令 前端js文件该如何合并三个方式如下:1. 一个大文件,所有js合并成一个大文件,所有页面都引用它.2. 各个页面大文件,各自页面合并生成自己所需js的大文 ...

  7. javascript异步延时载入及推断是否已载入js/css文件

    <html> <head> <script type="text/javascript"> /**======================= ...

  8. MVC打包压缩JS&CSS文件调试时过滤了一些文件

    BundleTable.这个确实是比较好用,打包并压缩了CSS,使之加载时减少流量. 但是在调试的时候会疑问为何有很多JS,CSS文件无法打包,其实是因为调试时VS自动过滤了如下文件:   后台跟踪了 ...

  9. 开箱即用 - Grunt合并和压缩 js,css 文件

    js,css 文件合并与压缩 Grunt 是前端自动化构建工具,类似webpack. 它究竟有多强悍,请看它的 介绍. 这里只演示如何用它的皮毛功能:文件合并与压缩. 首先说下js,css 合并与压缩 ...

  10. js动态加载js css文件,可以配置文件后辍,防止浏览器缓存

    js的引用,在浏览器,或微信上访问经常会遇到文件改了,但就是没有更新的问题,使用此函数可以轻松解决缓存问题只需要把js的引用方式改为使用此函数加载即可 源码如下: /** * js动态加载js css ...

随机推荐

  1. Linux 添加虚拟网卡

    使用的Linux版本是Centos 7: [root@vnode33 bin]# cat /etc/redhat-release CentOS Linux release (Core) 使用ifcon ...

  2. Python中函数的参数-arguments

    归纳起来,Python中函数的定义形式和调用形式主要有如下几种形式: # 函数的定义形式 def func(name) # 匹配positional参数或者keyword参数 def func(nam ...

  3. c# 两个软件传参

    1.socket 传参,类似于小型的服务器和客户端,一端发送,另一端保持监听状态. 2.通过第三方  数据库或者文件.

  4. C#语言使用redis

    文章:Redis总结(二)C#中如何使用redis 文章:Redis总结(三)Redis 的主从复制 文章:Redis总结(四)Redis 的持久化

  5. DAY7敏捷冲刺

    站立式会议 工作安排 (1)服务器配置 服务器端项目结构调整 (2)数据库配置 单词学习记录+用户信息 (3)客户端 客户端项目结构调整,代码功能分离 燃尽图 燃尽图有误,已重新修改,先贴卡片的界面, ...

  6. Debian常用設置

    1. 更新軟件源 sudo cp /etc/apt/sources.list /etc/apt/sources.list_bak #備份 sudo vi /etc/apt/sources.list / ...

  7. linux下安装多个jdk版本的切换问题

    下载地址: https://www.azul.com/downloads/zulu/ 解压: [root@localhost java]# tar -zxvf /usr/java/zulu8.38.0 ...

  8. arm交叉编译器gnueabi、none-eabi、arm-eabi、gnueabihf的区别

    转自 https://www.cnblogs.com/linuxbo/p/4297680.html 命名规则 交叉编译工具链的命名规则为:arch [-vendor] [-os] [-(gnu)eab ...

  9. oracle 9i 图文安装教程 oracle 9i 安装

    我的安装文件是ISO镜像文件,使用Virtual DAEMON Manager v 4.10打开: ora9i-1.iso ora9i-2.iso ora9i-3.iso 首先必须把上面三个镜像文件都 ...

  10. 使用tc来控制网络流量

    https://blog.csdn.net/qinyushuang/article/details/46611709 tc实际操控网络的流量 解释网络tc的架构,从架构上分析tc,与netfilter ...