您的位置:首页 > 产品设计 > UI/UE

maven中用yuicompressor和closure-compiler对js、css文件进行压缩

2014-02-07 17:33 351 查看
转载自:http://matychen.iteye.com/blog/1477350

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

直接放代码: 

Xml代码  



<!-- js压缩 -->  

            <plugin>  

                <groupId>net.alchim31.maven</groupId>  

                <artifactId>yuicompressor-maven-plugin</artifactId>  

                <version>1.3.0</version>  

                <executions>  

                    <execution>  

                        <phase>install</phase>  

                        <goals>  

                            <goal>compress</goal>  

                        </goals>  

                        <configuration>  

                            <excludes>  

                                <exclude>**/*.min.js</exclude>  

                                <exclude>**/*-min.js</exclude>  

                            </excludes>  

                            <nosuffix>true</nosuffix>  

                            <linebreakpos>-1</linebreakpos>  

                        </configuration>  

                    </execution>  

                </executions>  

            </plugin>  

            <!-- native2ascii -->  

            <plugin>  

                <groupId>org.codehaus.mojo</groupId>  

                <artifactId>native2ascii-maven-plugin</artifactId>  

                <version>1.0-beta-1</version>  

                <executions>  

                    <execution>  

                        <phase>install</phase>  

                        <goals>  

                            <goal>native2ascii</goal>  

                        </goals>  

                        <configuration>  

                            <workDir>${project.build.directory}/${project.build.finalName}</workDir>  

                            <excludes>  

                                <exclude>**/*.css</exclude>  

                            </excludes>  

                            <includes>  

                                <include>resources/js/*.js</include>  

                            </includes>  

                        </configuration>  

                    </execution>  

                </executions>  

            </plugin>  

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

Xml代码  



<plugin>  

                <groupId>org.apache.maven.plugins</groupId>  

                <artifactId>maven-dependency-plugin</artifactId>  

                <version>2.4</version>  

                <executions>  

                    <execution>  

                        <phase>validate</phase>  

                        <goals>  

                            <goal>copy</goal>  

                        </goals>  

                        <configuration>  

                            <artifactItems>  

                                <artifactItem>  

                                    <groupId>com.google.javascript</groupId>  

                                    <artifactId>closure-compiler</artifactId>  

                                    <version>r1810</version>  

                                    <type>jar</type>  

                                    <overWrite>true</overWrite>  

                                    <outputDirectory>${project.build.directory}/compressor</outputDirectory>  

                                    <destFileName>closure-compiler.jar</destFileName>  

                                </artifactItem>  

                                <artifactItem>  

                                    <groupId>com.yahoo.platform.yui</groupId>  

                                    <artifactId>yuicompressor</artifactId>  

                                    <version>2.4.6</version>  

                                    <type>jar</type>  

                                    <overWrite>true</overWrite>  

                                    <outputDirectory>${project.build.directory}/compressor</outputDirectory>  

                                    <destFileName>yuicompressor.jar</destFileName>  

                                </artifactItem>  

                            </artifactItems>  

                        </configuration>  

                    </execution>  

                </executions>  

            </plugin>  

            <plugin>  

                <groupId>org.apache.maven.plugins</groupId>  

                <artifactId>maven-antrun-plugin</artifactId>  

                <version>1.7</version>  

                <executions>  

                    <execution>  

                        <phase>install</phase>  

                        <goals>  

                            <goal>run</goal>  

                        </goals>  

                        <configuration>  

                            <tasks>  

                                <echo message="开始压缩 JS 文件. 请耐心等待!" />  

                                <property name="yuicompressor" value="${project.build.directory}/compressor/yuicompressor.jar" />  

                                <property name="closure-compiler" value="${project.build.directory}/compressor/closure-compiler.jar" />  

                                <property name="css.compress.directory" value="${project.build.directory}/${project.build.finalName}/resources" />  

                                <property name="js.compress.directory" value="${css.compress.directory}/js" />  

                                <apply executable="java" parallel="false" failonerror="true" dest="${js.compress.directory}">  

                                    <fileset dir="${js.compress.directory}" includes="**/*.js" />  

                                    <arg line="-jar" />  

                                    <arg path="${closure-compiler}" />  

                                    <arg line="--warning_level DEFAULT" />  

                                    <arg line="--compilation_level SIMPLE_OPTIMIZATIONS" />  

                                    <arg line="--js" />  

                                    <srcfile />  

                                    <arg line="--js_output_file" />  

                                    <targetfile />  

                                    <mapper type="regexp" from="^(.*)\.(js)$" to="\1-min.\2" />  

                                </apply>  

                                <move todir="${js.compress.directory}">  

                                    <fileset dir="${js.compress.directory}" includes="**/*.js" />  

                                    <mapper type="regexp" from="^(.*)-min\.(js)$" to="\1.\2" />  

                                </move>  

                                <echo message="成功压缩 JS 文件" />  

                                <echo message="开始压缩 CSS 文件. 请耐心等待!" />  

                                <apply executable="java" parallel="false" failonerror="true" dest="${css.compress.directory}">  

                                    <fileset dir="${css.compress.directory}" includes="**/*.css" />  

                                    <arg line="-jar" />  

                                    <arg path="${yuicompressor}" />  

                                    <arg line="--charset UTF-8" />  

                                    <arg value="--type"/>  

                                    <arg value="css"/>  

                                    <srcfile />  

                                    <arg line="-o" />  

                                    <targetfile />  

                                    <mapper type="regexp" from="^(.*)\.(css)$" to="\1-min.\2" />  

                                </apply>  

                                <move todir="${css.compress.directory}">  

                                    <fileset dir="${css.compress.directory}" includes="**/*.css" />  

                                    <mapper type="regexp" from="^(.*)-min\.(css)$" to="\1.\2" />  

                                </move>  

                                <echo message="成功压缩 CSS 文件" />  

                            </tasks>  

                        </configuration>  

                    </execution>  

                </executions>  

            </plugin>  

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

Js代码  



var uglify = require("uglify-js")  

修改为 

Js代码  



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

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

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

Xml代码  



<echo message="开始压缩 JS 文件. 请耐心等待!" />  

                                <property name="uglifyjs" value="${project.build.directory}/compressor/uglify/uglifyjs" />  

                                <property name="yuicompressor" value="${project.build.directory}/compressor/yuicompressor.jar" />  

                                <property name="closure-compiler" value="${project.build.directory}/compressor/closure-compiler.jar" />  

                                <property name="css.compress.directory" value="${project.build.directory}/${project.build.finalName}/resources" />  

                                <property name="js.compress.directory" value="${css.compress.directory}/js" />  

                                <apply executable="node" parallel="false" failonerror="true" dest="${js.compress.directory}">  

                                    <fileset dir="${js.compress.directory}" includes="**/*.js" />  

                                    <arg line=" ${uglifyjs}" />  

                                    <arg line=" --ascii" />  

                                    <arg line=" -o" />  

                                    <targetfile />  

                                    <srcfile />  

                                    <mapper type="regexp" from="^(.*)\.(js)$" to="\1-min.\2" />  

                                </apply>  

                                <move todir="${js.compress.directory}">  

                                    <fileset dir="${js.compress.directory}" includes="**/*.js" />  

                                    <mapper type="regexp" from="^(.*)-min\.(js)$" to="\1.\2" />  

                                </move>  
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: