Skip to content

Commit

Permalink
Add the ability to validate, concatenate and minify JS and CSS files …
Browse files Browse the repository at this point in the history 
…with the wro4j plugin AEROGEAR-123 and AEROGEAR-62
  • Loading branch information
@kborchers
kborchers committed Feb 22, 2012
1 parent a209ae8 commit 02ff16d
Show file tree
Hide file tree
Showing 5 changed files with 138 additions and 30 deletions.
21 changes: 21 additions & 0 deletions kitchensink-html5-mobile/README.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -84,6 +84,27 @@ To undeploy run this command:
You can also start the JBoss container and deploy the project using JBoss Tools. See the
<a href="https://docs.jboss.org/author/display/AS71/Getting+Started+Developing+Applications+Guide" title="Getting Started Developing Applications Guide">Getting Started Developing Applications Guide</a>
for more information.

Minification
============================

By default, the JavaScript and CSS files will be deployed as is without any
concatenation or minification of these files. Using the [wro4j](http://code.google.com/p/wro4j/)
plugin, these files can be concatenated, validated and minified.

With just a few quick changes to the project, you can deploy minified versions
of your JavaScript and CSS.

First, in the <project-root>/client/src/main/webapp/index.html file, search for
references to minification and comment or uncomment the appropriate lines.

Next, when deploying the application before you run `mvn package`, use the
following command in the <project-root>/client/ directory:

mvn wro4j:run

Finally, follow the deployment procedure as described above and your JavaScript
and CSS files will be minified.

Running the Arquillian tests
============================
Expand Down
115 changes: 86 additions & 29 deletions kitchensink-html5-mobile/client/pom.xml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,42 +22,99 @@
<!-- Explicitly declaring the source encoding eliminates the following message: -->
<!-- [WARNING] Using platform encoding (UTF-8 actually) to copy filtered resources, i.e. build is platform dependent! -->
<project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>

<wro4j.version>1.4.4</wro4j.version>
</properties>

<build>
<!-- Maven will append the version to the finalName (which is the name given to the generated war, and hence the context
root) -->
<finalName>${project.artifactId}</finalName>
<plugins>
<plugin>
<artifactId>maven-war-plugin</artifactId>
<configuration>
<!-- Java EE 6 doesn't require web.xml, Maven needs to catch up! -->
<failOnMissingWebXml>false</failOnMissingWebXml>
</configuration>
</plugin>
<!-- The JBoss AS plugin deploys your war to a local JBoss AS container -->
<!-- To use, run: mvn package jboss-as:deploy -->
<plugin>
<groupId>org.jboss.as.plugins</groupId>
<artifactId>jboss-as-maven-plugin</artifactId>
</plugin>
<pluginManagement>
<plugins>
<plugin>
<artifactId>maven-war-plugin</artifactId>
<configuration>
<!-- Java EE 6 doesn't require web.xml, Maven needs to catch up! -->
<failOnMissingWebXml>false</failOnMissingWebXml>
</configuration>
</plugin>
<!-- The JBoss AS plugin deploys your war to a local JBoss AS container -->
<!-- To use, run: mvn package jboss-as:deploy -->
<plugin>
<groupId>org.jboss.as.plugins</groupId>
<artifactId>jboss-as-maven-plugin</artifactId>
</plugin>

<plugin>
<groupId>com.mycila.maven-license-plugin</groupId>
<artifactId>maven-license-plugin</artifactId>
<configuration>
<includes>
<include>src/**</include>
</includes>
<excludes>
<exclude>src/main/webapp/js/libs/**</exclude>
<exclude>src/main/webapp/css/jquery.mobile-1.0.min.css</exclude>
<exclude>src/test/qunit/qunit/**</exclude>
</excludes>
</configuration>
</plugin>

<plugin>
<groupId>ro.isdc.wro4j</groupId>
<artifactId>wro4j-maven-plugin</artifactId>
<version>${wro4j.version}</version>
<executions>
<execution>
<phase>compile</phase>
<goals>
<goal>run</goal>
</goals>
</execution>
</executions>
<configuration>
<targetGroups>app.min,m.screen.min,screen.min</targetGroups>
<wroFile>${basedir}/src/main/webapp/WEB-INF/wro.xml</wroFile>
<cssDestinationFolder>${basedir}/src/main/webapp/css/</cssDestinationFolder>
<jsDestinationFolder>${basedir}/src/main/webapp/js/</jsDestinationFolder>
<contextFolder>${basedir}/src/main/webapp/</contextFolder>
<extraConfigFile>${basedir}/src/main/webapp/WEB-INF/wro.properties</extraConfigFile>
<wroManagerFactory>ro.isdc.wro.maven.plugin.manager.factory.ConfigurableWroManagerFactory</wroManagerFactory>
</configuration>
</plugin>

<plugin>
<groupId>com.mycila.maven-license-plugin</groupId>
<artifactId>maven-license-plugin</artifactId>
<configuration>
<includes>
<include>src/**</include>
</includes>
<excludes>
<exclude>src/main/webapp/js/libs/**</exclude>
<exclude>src/main/webapp/css/jquery.mobile-1.0.min.css</exclude>
<exclude>src/test/qunit/qunit/**</exclude>
</excludes>
</configuration>
</plugin>
</plugins>
<!--This plugin's configuration is used to store Eclipse m2e settings only. It has no influence on the Maven build itself.-->
<plugin>
<groupId>org.eclipse.m2e</groupId>
<artifactId>lifecycle-mapping</artifactId>
<version>1.0.0</version>
<configuration>
<lifecycleMappingMetadata>
<pluginExecutions>
<pluginExecution>
<pluginExecutionFilter>
<groupId>ro.isdc.wro4j</groupId>
<artifactId>
wro4j-maven-plugin
</artifactId>
<versionRange>
[1.4.4,)
</versionRange>
<goals>
<goal>run</goal>
</goals>
</pluginExecutionFilter>
<action>
<ignore></ignore>
</action>
</pluginExecution>
</pluginExecutions>
</lifecycleMappingMetadata>
</configuration>
</plugin>
</plugins>
</pluginManagement>
</build>

<profiles>
Expand Down
1 change: 1 addition & 0 deletions kitchensink-html5-mobile/client/src/main/webapp/WEB-INF/wro.properties
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
preProcessors=uglifyJs,cssMin
17 changes: 17 additions & 0 deletions kitchensink-html5-mobile/client/src/main/webapp/WEB-INF/wro.xml
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
<?xml version="1.0" encoding="UTF-8"?>
<groups xmlns="http://www.isdc.ro/wro"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://www.isdc.ro/wro wro.xsd">

<group name="app.min">
<js>/js/app.js</js>
</group>

<group name="m.screen.min">
<css>/css/m.screen.css</css>
</group>

<group name="screen.min">
<css>/css/screen.css</css>
</group>
</groups>
14 changes: 13 additions & 1 deletion kitchensink-html5-mobile/client/src/main/webapp/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,13 @@
<script type="text/javascript" src="js/libs/modernizr-2.0.6.js"></script>
<script type="text/javascript" src="js/libs/yepnope.1.0.2-min.js"></script>
<script type="text/javascript" src="js/libs/underscore-min.js"></script>

<!-- Minification - See Readme for details -->
<!-- For minification, comment out this file -->
<script type="text/javascript" src="js/app.js"></script>
<!-- For minification, uncomment this file -->
<!-- <script type="text/javascript" src="js/app.min.js"></script> -->

<script type="text/javascript">
yepnope([{
//Load CDN hosted jQuery or fall back to local file.
Expand Down Expand Up @@ -66,11 +72,17 @@
//assign labeled callbacks for later execution after script loads.
//we are on mobile device so load appropriate CSS
"jqmcss": "css/jquery.mobile-1.0.min.css",
// For minification, uncomment this line
//"mcss": "css/m.screen.min.css"
// For minification, comment out this line
"mcss": "css/m.screen.css"
},
nope: {
//we are on desktop
"scss": "css/screen.css"
// For minification, uncomment this line
//"scss": "css/screen.min.css"
// For minification, comment out this line
"scss": "css/screen.css"
},
callback: {
//use the labeled callbacks from above, and load jQuery Mobile
Expand Down

0 comments on commit 02ff16d

Please sign in to comment.