在我们使用maven打包时,很多时间需要压缩js,以前很流行的yuicompressor-maven-plugin插件,随着es6的到来,已经变得不可用了。网上经过众多搜索后,发现可以使用Minify Maven Plugin/closure-compiler-maven-plugin插件使maven能支持es6的压缩。
- Minify Maven Plugin
此插件集成了yuicompressor 与google 的closure-compiler编译器,可以压缩css/js,但是缺点使用的closure-compiler是2016年版本,压缩后的目标文件不能生产ECMASCRIPT2015(ES6)(使用WHITESPACE_ONLY模式时,可以生成ES6版本,但是...)版本,最高只能生成ES5。
具体使用可以参考
https://github.com/samaxes/minify-maven-plugin
https://samaxes.github.io/minify-maven-plugin/
这里介绍一下不加.min后缀的压缩方式:(configuration中的配置参数都可以使用eclipse自动提示功能查看其意义)
<plugin> <groupId>com.samaxes.maven</groupId> <artifactId>minify-maven-plugin</artifactId> <version>1.7.6</version> <executions> <execution> <id>default-minify</id> <configuration> <charset>UTF-8</charset> <cssSourceDir>./</cssSourceDir> <!-- 压缩webapp目录下的所有js文件,但是排除*.min.js文件; --> <jsSourceDir>./</jsSourceDir> <jsIncludes> <jsInclude>**/*.js</jsInclude> </jsIncludes> <jsExcludes> <jsExclude>**/*.min.js</jsExclude> </jsExcludes> <!-- 使用closure压缩时的压缩级别,默认值为SIMPLE_OPTIMIZATIONS。可选值: --> <!-- WHITESPACE_ONLY:只压缩空格和转换一些特殊符号 --> <!-- SIMPLE_OPTIMIZATIONS:简单的压缩 --> <!-- ADVANCED_OPTIMIZATIONS:高级压缩,此压缩方式下可能会将引用的第3方框架的方法名称修改,导致js报错;慎用。 --> <closureCompilationLevel>SIMPLE_OPTIMIZATIONS</closureCompilationLevel> <!-- js压缩引擎,默认值为YUI。可选值: --> <!-- YUI: 使用YUI Compressor压缩; --> <!-- CLOSURE: 使用Google Closure Compiler压缩 --> <jsEngine>CLOSURE</jsEngine> <skipMerge>true</skipMerge><!-- 不合并js/css --> <nosuffix>true</nosuffix><!-- 压缩后的文件不.js前添加.min前缀 --> </configuration> <goals> <goal>minify</goal> </goals> </execution> </executions> </plugin> <plugin> <groupId>org.apache.maven.plugins</groupId> <artifactId>maven-war-plugin</artifactId> <configuration> <!-- 如果不增加此配置 src/main/webapp 下面的内容 会重新复制到target输出目录 覆盖掉编译后的内容 这样编译的还是未压缩过的内容,增加上此过滤 打war包就不会内容覆盖 --> <warSourceExcludes> <![CDATA[ %regex[^.+(?:(?<!(?:-|\.)min)\.js)], %regex[^.+(?:(?<!(?:-|\.)min)\.css)] ]]> </warSourceExcludes> </configuration> </plugin>
- closure-compiler-maven-plugin
closure-compiler-maven-plugin这个插件是Minify Maven Plugin的变种,在其基础上演变而来的。可以支持压缩后的js格式为ES6,但不能支持css的压缩,configuration节点格式与Minify Maven Plugin插件有所不同。
参见:
https://github.com/blutorange/closure-compiler-maven-plugin
https://blutorange.github.io/closure-compiler-maven-plugin/
使用方法:(configuration中的配置参数都可以使用eclipse自动提示功能查看其意义)<plugins> <plugin> <!-- 此插件只能压缩js,不能压缩css;如果需要压缩css,可以考虑使用yuicompressor --> <groupId>com.github.blutorange</groupId> <artifactId>closure-compiler-maven-plugin</artifactId> <version>2.9.0</version> <executions> <execution> <id>default-minify</id> <configuration> <encoding>UTF-8</encoding> <!-- 压缩webapp目录下的所有js文件,但是排除*.min.js文件; --> <targetDir>./</targetDir> <includes>**/*.js</includes> <excludes>**/*.min.js</excludes> <!-- 输出目录为${project.build.directory}/${project.build.finalName}下的目录,不配置时默认为js. --> <sourceDir>./</sourceDir> <!-- 跳过js文件合并 --> <skipMerge>true</skipMerge> <!-- js文件输出格式,默认为#{path}/#{basename}.min.#{extension} --> <outputFilename>#{path}/#{basename}.#{extension}</outputFilename> <!-- js源文件版本,直接填最高即可,都能向下兼容 --> <closureLanguageIn>ECMASCRIPT_2019</closureLanguageIn> <!-- js压缩后的文件格式版本,注意与浏览器的兼容性 --> <closureLanguageOut>ECMASCRIPT_2015</closureLanguageOut> <!-- 使用closure压缩时的压缩级别,默认值为SIMPLE_OPTIMIZATIONS。可选值: --> <!-- WHITESPACE_ONLY:只压缩空格和转换一些特殊符号 --> <!-- SIMPLE_OPTIMIZATIONS:简单的压缩 --> <!-- ADVANCED_OPTIMIZATIONS:高级压缩,此压缩方式下可能会将引用的第3方框架/其它js文件中的的方法名称修改,导致js报错;慎用。 --> <closureCompilationLevel>SIMPLE_OPTIMIZATIONS</closureCompilationLevel> </configuration> <goals> <goal>minify</goal> </goals> <phase>generate-resources</phase> </execution> </executions> </plugin> <plugin> <groupId>org.apache.maven.plugins</groupId> <artifactId>maven-war-plugin</artifactId> <configuration> <!-- 如果不增加此配置 src/main/webapp 下面的内容 会重新复制到target输出目录 覆盖掉编译后的内容 这样编译的还是未压缩过的内容,增加上此过滤 打war包就不会内容覆盖 --> <warSourceExcludes> <![CDATA[ %regex[^.+(?:(?<!(?:-|\.)min)\.js)], %regex[^.+(?:(?<!(?:-|\.)min)\.css)] ]]> </warSourceExcludes> </configuration> </plugin>