本文介紹通過使用yuicompressor-maven-plugin插件實現js及css代碼的自動壓縮,方便集成到持續集成環境中,如jenkins。
一、配置yuicompressor-maven-plugin
在pom文件中增加該插件的定義,示例如下:
<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>
<encoding>UTF-8</encoding>
<!-- 忽略 js 錯誤警告 -->
<jswarn>false</jswarn>
<nosuffix>true</nosuffix>
<linebreakpos>-1</linebreakpos>
<includes>
<include>js/**/*.js</include>
<include>css/**/*.css</include>
</includes>
<excludes>
<exclude>**/**min.js</exclude>
<exclude>js/ba/**/*.js</exclude>
</excludes>
</configuration>
</plugin>
1、execution表示執行的操作,可以指定操作在maven的哪個生命周期運行,不同的生命周期對打包操作會有影響,如配置在compile階段運行壓縮:
<executions>
<execution>
<phase>compile</phase>
<goals>
<goal>compress</goal>
</goals>
</execution>
</executions>
2、經驗證發現該插件運行時所在的位置是項目編譯打包的輸出路徑,比如項目名稱為abc,當前文件夾應為project_root/target/abc。maven在打包的時候會把所有編譯的文件、webapp下的文件復制到該目錄中為打包做准備。
3、include節點用於配置需要壓縮的文件路徑,可以使用通配符,*表示一個文件或路徑名,**表示多個文件或路徑名,exclude節點用於配置排除壓縮的文件路徑,exclude只會排除include中設置的路徑下的文件或路徑。
二、配置maven-war-plugin
<plugin>
<groupId>org.apache.maven.plugins</groupId>
<artifactId>maven-war-plugin</artifactId>
<configuration>
<warName>${artifactId}</warName>
<warSourceExcludes>js/**/*.js,css/**/*.css</warSourceExcludes>
</configuration>
</plugin>
在配置過程中發現無論將phase設置為哪個階段,最終打包的文件總是原始文件,並未被壓縮,后來測試發現maven-war-plugin會自動把webapp目錄下的文件復制到輸出路徑,因此可以通過warSourceExcludes配置排除復制,的文件或路徑,如上例中指定排除js目錄下的所有js文件,css目錄下的所有css文件。
三、常見錯誤
壓縮js文件時,如果代碼中包含debugger,yuicompressor會認為其為保留關鍵字,注釋或刪除可以使打包正常進行,也可以使用eval('debugger')替換debugger。
[ERROR] ...\src\main\webapp\js\Scroll.js:line 371:column 11:identifier is a reserved word debugger;
[ERROR] ...\src\main\webapp\js\Scroll.js:line 1:column 0:Compilation produced 1 syntax errors.
四、相關資料
插件主站地址:http://alchim.sourceforge.net/yuicompressor-maven-plugin/
插件配置參數:http://alchim.sourceforge.net/yuicompressor-maven-plugin/compress-mojo.html#resources
配置示例:http://www.myexception.cn/operating-system/427170.html
參考其他相關資料:http://blog.csdn.net/fengshizty/article/details/50541957

