Javascript – YUI Compressor Maven plugin executed at wrong time and tomcat plugin not using yui-compressor output

javajavascriptmavenyui-compressor

I am trying to use the YUI Compressor plugin for maven to compress my CSS and JavaScript, but I'm experiencing two problems.

  1. My configuration properly compresses and aggregates the JavaScript files, but if I run mvn package to make a war file, maven will compress the JavaScript files BEFORE it copies over the src/main/webapp folder. This overwrites all of the compressed css and JavaScript files. How can I fix this?

  2. How do I get the tomcat maven plugin to use the compressed JavaScript files rather than the ones in my src/main/webapp/scripts folder? When my application is trying to read all.js, it is failing because it is located in the target/ directory and not in my src/main/webapps folder.

        <!-- Tomcat -->
        <plugin>
            <groupId>org.codehaus.mojo</groupId>
            <artifactId>tomcat-maven-plugin</artifactId>
            <version>1.1</version>
            <configuration>
                <warFile>target/myapp-1.0.war</warFile>
            </configuration>
        </plugin>
    
        <!-- YUI Compressor -->
        <plugin>
            <groupId>net.alchim31.maven</groupId>
            <artifactId>yuicompressor-maven-plugin</artifactId>
            <executions>
                <execution>
                    <goals>
                        <goal>compress</goal>
                    </goals>
                </execution>
            </executions>
            <configuration>
                <excludes>
                    <exclude>**/jwplayer.js</exclude>
                    <exclude>**/audio-player-noswfobject.js</exclude>
                    <exclude>**/audio-player-uncompressed.js</exclude>
                    <exclude>**/audio-player.js</exclude>
                    <exclude>**/jscharts.js</exclude>
                    <exclude>**/jquery-ui-1.8.16.custom.min.js</exclude>
                </excludes>
                <nosuffix>true</nosuffix>
                <jswarn>false</jswarn>
                <force>false</force>
                <aggregations>
                    <aggregation>
                        <removeIncluded>false</removeIncluded>
                        <insertNewLine>true</insertNewLine>
                        <output>${project.build.directory}/${project.build.finalName}/scripts/all.js</output>
                        <includes>
                            <include>**/json/json2.js</include>
                            <include>**/jwplayer/jwplayer.js</include>
                            <include>**/font/font.js</include>
                            <include>**/underscore/underscore.js</include>
                            <include>**/jquery/jquery-1.7.1.js</include>
                            <include>**/jquery/jquery-ui-1.8.16.custom.min.js</include>
                            <include>**/jquery/jquery.cookie.js</include>
                            <include>**/jquery/jquery.fancybox.js</include>
                            <include>**/jquery/jquery.highlight.js</include>
                            <include>**/jquery/jquery.jcrop.js</include>
                            <include>**/jquery/jquery.tmpl.js</include>
                            <include>**/jquery/farbtastic.js</include>
                            <include>**/jscharts/jscharts.js</include>
    
                            <include>**/myapp/homepage.js</include>
                        </includes>
                    </aggregation>
                </aggregations>
            </configuration>
        </plugin>
    

Or am I just going about my goal the wrong way?

Here is the maven output when packaging the war. You can see that even if I tell the yui:compress goal to in the pre-package phase, it still occurs before the copying of the resources since this occurs in the package phase:

[INFO] ------------------------------------------------------------------------
[INFO] Building My App 1.0
[INFO] ------------------------------------------------------------------------
Downloading: http://repo1.maven.org/maven2/net/alchim31/maven/yuicompressor-maven-plugin/maven-metadata.xml
Downloading: http://snapshots.repository.codehaus.org/net/alchim31/maven/yuicompressor-maven-plugin/maven-metadata.xml
Downloading: http://download.java.net/maven/2/net/alchim31/maven/yuicompressor-maven-plugin/maven-metadata.xml
Downloading: http://oss.sonatype.org/content/groups/public/net/alchim31/maven/yuicompressor-maven-plugin/maven-metadata.xml
Downloaded: http://oss.sonatype.org/content/groups/public/net/alchim31/maven/yuicompressor-maven-plugin/maven-metadata.xml (442 B at 2.1 KB/sec)
Downloaded: http://repo1.maven.org/maven2/net/alchim31/maven/yuicompressor-maven-plugin/maven-metadata.xml (403 B at 0.9 KB/sec)
[INFO] 
[INFO] --- maven-resources-plugin:2.4.3:resources (default-resources) @ myapp ---
[INFO] Using 'UTF-8' encoding to copy filtered resources.
[INFO] Copying 26 resources
[INFO] Copying 4 resources
[INFO] 
[INFO] --- maven-compiler-plugin:2.3.2:compile (default-compile) @ myapp ---
[INFO] Nothing to compile - all classes are up to date
[INFO] 
[INFO] --- maven-compiler-plugin:2.3.2:compile (default) @ myapp ---
[INFO] Nothing to compile - all classes are up to date
[INFO] 
[INFO] --- aspectj-maven-plugin:1.3:compile (default) @ myapp ---
[INFO] 
[INFO] --- maven-resources-plugin:2.4.3:testResources (default-testResources) @ myapp ---
[INFO] Using 'UTF-8' encoding to copy filtered resources.
[INFO] Copying 11 resources
[INFO] 
[INFO] --- maven-compiler-plugin:2.3.2:testCompile (default-testCompile) @ myapp ---
[INFO] Nothing to compile - all classes are up to date
[INFO] 
[INFO] --- aspectj-maven-plugin:1.3:test-compile (default) @ myapp ---
[INFO] No modifications found skipping aspectJ compile
[INFO] 
[INFO] --- maven-surefire-plugin:2.6:test (default-test) @ myapp ---
[INFO] Tests are skipped.
[INFO] 
[INFO] --- yuicompressor-maven-plugin:1.2:compress (default) @ myapp ---
[INFO] 960.css (9989b) -> 960.css (5897b)[59%]
[INFO] base.css (24210b) -> base.css (16437b)[67%]
[INFO] reset.css (2062b) -> reset.css (1096b)[53%]
[INFO] text.css (1270b) -> text.css (598b)[47%]
[INFO] tinymce.css (1994b) -> tinymce.css (1277b)[64%]
[INFO] jquery.fancybox-1.3.4.css (8852b) -> jquery.fancybox-1.3.4.css (6975b)[78%]
[INFO] farbtastic.css (1362b) -> farbtastic.css (478b)[35%]
[INFO] jquery.jcrop.css (748b) -> jquery.jcrop.css (582b)[77%]
[INFO] base.css (34567b) -> base.css (25034b)[72%]
[INFO] jquery-ui-1.8.11.custom.css (33994b) -> jquery-ui-1.8.11.custom.css (25351b)[74%]
.... (tons of javascript files)
[INFO] why.js (515b) -> why.js (354b)[68%]
[INFO] underscore.js (26960b) -> underscore.js (9472b)[35%]
[INFO] total input (1832512b) -> output (1198425b)[65%]
[INFO] generate aggregation : C:\Users\egervari\IdeaProjects\myapp-development\target\myapp-1.0\scripts\all.js
[INFO] all.js (564342b)
[INFO] nb warnings: 0, nb errors: 0
[INFO] 
[INFO] --- maven-war-plugin:2.1.1:war (default-war) @ myapp ---
[INFO] Packaging webapp
[INFO] Assembling webapp [myapp] in [C:\Users\egervari\IdeaProjects\myapp-development\target\myapp-1.0]
[INFO] Processing war project
[INFO] Copying webapp resources [C:\Users\egervari\IdeaProjects\myapp-development\src\main\webapp]

Even if changing the phase did work, then I would also have to get this compression to run before tomcat:run as well.

Is maven just the wrong tool for the job you think? Or is maven/java just not up-to-snuff with heavy javascript development? Why is this so hard?

Best Answer

I faced a similar issue and I changed my phase to package. Hopefully this will help someone else as well.

This is tricky. This has to do with the nosuffix config option. If you remove the nosuffix option, the minification works as expected.

If you really have to have nosuffix then you need to change the execution phase to "package".

    <executions>
      <execution>
        <phase>package</phase>
          <goals>
    ......
    .....

Any phase before prepare-resources doesn't work because when the war is built, it picks up the js from the original source location and thereby overwrites the minified js (created during prepare-resources phase) in the target directory.

Minification works when you remove nosuffix because during package phase, the file names are different, so there is no over-writing of the files and you will see both the minified and non-minified js files in your target directory.