Tutorial: Getting Started with Flex and Maven

Most Flex (and AIR) developers like to build, compile and package their applications using Adobe’s Flash Builder (formerly known as Flex Builder).  A few use alternative IDE(s) like FDT and IntelliJ IDEA. A smaller few bravely get everything done without an IDE.

As applications mature from sandboxes to production environments, a few developers start leveraging build tools like Apache Ant to automate and ease the process of compilation, packaging and deployment. They often use Ant with their IDE, typically Flash Builder. A popular and supported bundle of readily available Ant tasks, called Flex Ant Tasks, are available both with the open source Flex SDK and with Flash Builder. A few developers go beyond these build scripts and begin to leverage Maven.

Before we go further on Flex and Maven, it would be important to define what Maven is. Long time Maven lovers may be completely shocked that Maven needs introduction. However, among many Flex developers Maven is a complete stranger and so it may be a good idea to get them on the same page as those who swear by this tool.

Lets start out with the official and formal definition, which is:

“Maven is a project management tool which encompasses a project object model, a set of standards, a project lifecycle, a dependency management system, and logic for executing plugin goals at defined phases in a lifecycle. When you use Maven, you describe your project using a well-defined project object model, Maven can then apply cross-cutting logic from a set of shared (or custom) plugins.”

 

If this sounds complicated or bubbles up ideas of a project management tool with timelines, work allocation and such then the definition has most certainly, if anything, mislead you, perhaps convincing you to run away as far as possible from Maven. Lets try and understand what Maven exactly is.

Simply put, Maven is a super build tool that can not only make it easy to compile, package and deploy applications but also helps do many other value added tasks like resolve dependencies, generate websites, invoke external scripts and keep track of application versions. While it provides these and many more excellent features, it upholds the reuse and DRY (Don’t repeat yourself) principles. It brings object orientation to build management and allows the process to be defined in a “Project Object Model” (POM). POM definition exists in an xml format within a file named pom.xml.

Maven is completely modular, where each of its features is provided by a plugin. A Maven plugin can do one or more things, which are encapsulated and available as goals. So you rely on a Maven plugin goal to carry out what in traditional terms would be called a task. Besides executing tasks, Maven is capable of mapping its plugins and plugin goals to a project lifecycle phase. By default Maven defines the following phases in a build lifecycle:

1. Validate – check and verify that the project is correct and all necessary information is available
2. Compile - compile the source to byte code or a binary
3. Test – run defined unit tests using a unit testing framework
4. Package – bundle the compiled code into a desired package format, for example put Java compiled code in a JAR or compiled Flex (MXML and AS3) code in a SWF or a SWC (if the compiled code is defined, distributed and used as a library)
5. Integration-test – run integration tests
6. Verify – check if package is valid
7. Install - install the package in a local Maven repository so that it is can be readily accessed when required to execute relevant plugin goals or resolve dependencies
8. Deploy – deploy the package to the production environment

 

This allows the execution of multiple and all relevant plugin goals simply by execution of a maven build lifecycle phase. Maven phases are sequential so execution of a particular phase triggers execution of all phases prior to the one specified. As an example the install lifecycle phase invocation implies execution of all relevant plugin goals for validate, compile, test, package, integration-test, verify and install phases.

Maven promotes convention over configuration. This means, sticking with Maven defaults lets you get done a lot with very little configuration. This enhances productivity, reduces errors and promotes standardization. Maven, however, does not stop you from customizing your setup, except that in such a case you would need to write a lot more configuration than usual. Maven has a lot of other niceties and a rich set of plugins. You can learn all about Maven with the help of two excellent Sonatype free online books:

• Maven by Example
• Maven: The Complete Reference

Assuming you understand Maven fundamentals by now and are willing to even the learning curve by banking on the free Maven books, let’s start using it to build Flex and AIR applications.

 

Installing Maven

If you don’t already have Maven, then first download and install it on the machine. Installing Maven typically involves four simple steps, which are as follows:

1) Download a release build archive appropriate for your platform from http://maven.apache.org/download.html. You may want to get the zip file on a Windows machine and tarred zip or bz2 file on a Linux, Unix or Mac OSX machine.

2) Expand the archive file in a preferred folder within your file system.

3) Create or update a few environment variables, namely:

• JAVA_HOME – point it to your JDK folder. I assume JDK is already installed. If not, go get it before you go further.
• M2_HOME – point it to the folder where Maven is installed. It’s the same that was created when you extracted the Maven archive.
• M2 – point it to %M2_HOME%\bin on windows and $M2_HOME/bin on Linux/Unix/Mac OSX
• PATH – update the PATH environment variable. Add M2 to it.
• MAVEN_OPTS – Add -Xms256m -Xmx512m to this environment variable.

·     

Verify that Maven is installed and working. Open up a terminal window (command window or powershell on Windows7) and type “mvn --version” in it. If you see something as shown in Figure 1 then you are good to go.

 

Verifying that Maven is working by checking its version

 

Once Maven is installed we can begin to use it.

 

Configuring Flexmojos

You know by now that almost all of Maven’s features manifest in its plugins. That means to build a Flex and an AIR application with Maven we need a plugin that can help us do that.  In fact there is more than one plugin that can help us with it. The one that seems most matured and is in active development is Flexmojos and that is what I will use in this article.

To use Flexmojos, we don’t need to proactively download and install the plugin. In fact we never have to do that for any Maven plugin. Maven plugins are downloaded and installed to the local repository as needed. All we need to do is to reference it in our POM (defined in a pom.xml file). Maven plugins are typically available in and discoverable from public Maven repositories, unless of course if they are private. Private plugins are for consumption within a specific organization. Private repositories for organization wide consumption of plugins can be setup in a manner similar to public repositories. Nexus, a repository management product from Sonatype, makes hosted Maven repository creation and management very easy and effortless. A Maven plugin is downloaded when it is referenced the first time. It is then installed to a local repository so that they it be accessed locally when required again. This caching mechanism boosts performance and avoids unnecessary re-downloading of files. The local repository resides within a folder named “repository”, which lies within a folder named “.m2”.  When Maven is first used the “.m2”’ folder is created within a user’s home directory. Which means you will find “.m2” in /home/<username> in Linux, /Users/<username> in Mac OSX and C:\Users\<username> in Windows7.

Maven projects are identified with the help of a unique set of attributes often referred to as the Maven coordinates.  Maven coordinates consist of four different parts: groupId, artifactId, packaging and version. Each Maven project is uniquely identified by a unique combination of groupId, artifactId and version.  Brief definitions of the coordinate elements are as follows:

• groupId – unique identifier for the organization that owns and manages the project. For example we use our domain name reversed as in “com.treasuryofideas” as the groupId for our Maven projects.
• artifactId – a unique identifier for the project itself.
• version – a specific release of the project.
• packaging – the archive format the project is bundled as. For Flex projects you would use SWF and for Flex library projects you would go with SWC.

Maven plugins follow a similar naming system and are identified with a groupId:artifactId:version combination. For example Flexmojos 3.7.1 can be identified as org.sonatype.flexmojos:flexmojos-maven-plugin:3.7.1.

The Flexmojos plugins are published on the central public Maven repository but to make sure you have access to the latest version and to all the dependencies of the plugin, you should explicitly add the Sonatype Flexmojos repository to your set of repositories. You could add the repository explicitly in a project POM or you could add the repository using Nexus. I will the take the simpler, though not necessarily robust, route of adding the Flexmojos repository in the project POM. You will see this in the next section.

 

Generating a Flex Project

Automating the task of creating an initial shell for a Flex project can help avoid complexities and potential errors around project setup. It helps you get started on the right foot!

Flexmojos has a set of archetypes that facilitates the creation of the following types of Flex projects:

• Flex application – a regular Flex application that gets packaged as a SWF and can be deployed to run in a Flash player.
• Flex Library – a library that gets packaged as a SWC and that is consumed by a Flex or AIR application.
• Flex multi-module project – a project that includes both library projects and a regular application and that is packages as a WAR, a web archive file.

 

Lets start out by generating a simple Flex application using the respective archetype. Just type the following in your terminal:

mvn archetype:generate  \
-DarchetypeRepository=http://repository.sonatype.org/content/groups/public  \
-DarchetypeGroupId=org.sonatype.flexmojos \
-DarchetypeArtifactId=flexmojos-archetypes-application \
-DarchetypeVersion=3.7.1

 ...and hit the enter/return key.

As soon as you hit the enter/return key, you will see Maven in action. Maven would figure out all the dependencies and start downloading all the plugins it needs to get your task done. It will also download a few default plugins that are pertinent to the typical build lifecycle phases.

After the required plugins are downloaded and installed, you will be presented with an interactive console that will ask you to input the Maven coordinate values (groupId, artifactId and version) for your project. It will also prompt you for the package name for your source code. Look at Figure 2, to see what I was prompted for and how I responded to it. You will notice that I chose default value of 1.0-SNAPSHOT for version and com.treasuryofideas (my groupId) as the package name.

 

Snippet of my terminal output during Flex application generation, using the Flexmojos archetype

 

Now browse into your folder from where you ran the Maven archetype generation command and you should see a project called “sampleapp” created for you. Review Figure 3 to see what the project directory structure and hierarchy looks like.

 

sampleapp project directory structure

 

The generated “sampleapp” contains 3 important entities:

• pom.xml – the project object model
• source code – within the src folder
• test code – within the test folder

 

Open pom.xml and you will notice a page full of generated configuration. Apart from the Maven co-ordinates, source directory, test directory, packaging format and plugin specification, you will also see a couple of dependencies on the Flex SDK and on FlexUnit.

Next, browse to src/main/flex and open Main.mxml. You may recall that Maven likes convention over configuration. One such convention is to keep project source code within src/main/<language/framework>/ folder and test code within src/test/<language/framework>/ folder. For Flex and AIR the language/framework value is “flex”. In case of Java you would see the source code in src/main/java.

You should see the following source (trimmed off the comments) contained in Main.mxml:

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
                  <mx:Text text="Hello World!"/>
</mx:Application>

 

If you are a Flex or AIR developer you instantly know this is Flex 3 code, which it is! You wouldn’t be able to generate the Flex 4 code using the archetype as of now. The latest version of the plugin, i.e. 4.0-alpha-3, still seems to generate Flex 3 code. Although you currently cannot generate a Flex 4 project using Flexmojos, you can build a Flex 4 project using it.

Last but not the least, you may want to browse into src/test/flex. You will see a TestApp AS3 class that extends flexunit.framework.TestCase.  This class is the place where you would add your unit tests as you develop your application.

Next, I will build, test and package this application. The shortest way to do this is to run the “install” phase on the Maven project. Running “install” would run all the goals in the phases up to and including “install”.  Before, I actually run “mvn install”, I will add the Flexmojos repository in the pom. Open pom.xml and add the following lines below the </profiles> closing tags:

<repositories>
    <repository>
      <id>flexmojos</id>
      <url>http://repository.sonatype.org/content/groups/flexgroup/</url>
    </repository>
  </repositories>

 

Now run “mvn install” on the terminal and wait for some Maven magic. You should see a lot of activity on the console including downloading of a few plugins and building of the sources. The last few lines should be as shown in Figure 4.

 

Successful build of the generated sampleapp

 

Intermittently you may also notice that a Flash player is launched for test. Install runs all the unit tests and that is why this happens. We haven’t defined any unit tests so far though so its possible you may barely noticed the test related activities and tasks.

To understand what all has been added and modified as a part of the Maven install command, let’s first review the folder structure which is illustrated in Figure 5.

sampleapp folder structure after running “mvn install”

 

The compiled and packaged SWF file, sampleapp-1.0-SANPSHOT.swf, resides in the target directory. Open that file using the local Flash player or any browser with a Flash player plugin and you should see the running application. The application prints out the quintessential first few words: “Hello World!”.  Figure 6 shows the application in a local Flash player on Mac OSX.

 

Hello World!

 

Now that you have generated and built a sample Flex application, lets also quickly generate and build a Flex library project.

 

Generating a Flex Library Project

Start out by entering the following in a terminal window:

mvn archetype:generate  \
-DarchetypeRepository=http://repository.sonatype.org/content/groups/public  \
-DarchetypeGroupId=org.sonatype.flexmojos \
-DarchetypeArtifactId=flexmojos-archetypes-library \
-DarchetypeVersion=3.7.1

 

Figure 7 shows the output of running the generate archetype for a Flex library project.

 

Flexmojos generate:archetype flexmojos-archetypes-library

 

The generated folder structure for the samplelib project should be as shown in Figure 8.

 

Generated folder structure for a Flex library project, samplelib

 

This time a class named App.as is generated, which contains the following:

package com.treasuryofideas {

                  public class App { 
                                    public static function greeting(name:String):String {
                                                      return "Hello, " + name;
                                    }
                  }
}

 

Next, easily build and package the Flex library using “mvn install”.  The output of this process creates a SWC file, samplelib-1.0-SNAPSHOT.swc, which can be linked to a Flex application and used as a Flex library typically is.

You can also generate a multimodule project using the archetypeArtifactId as flexmojos-archetypes-modular-webapp but I will not illustrate that here.  There is no Flexmojos archetype to generate an AIR application or a pure AS3 project.

Next, we try and synch up the Flexmojos’ approach with that of Flash Builder’s.

 

Importing Flexmojos projects into Flash Builder

Flexmojos projects follow the Maven idiom of development and so keep the source and output in folders that follows the Maven conventions. This however doesn’t by itself work with Flash Builder. For example, Flash Builder keeps its Main.mxml Flex application file within the src folder in the project, whereas Flexmojos keeps that within src/main/flex. To convert a Flexmojos project to a Flash Builder structure you could use the flexmojos:flexbuilder plugin goal.

To see how this works, first generate a new Flex application. I call it samplefbapp. Once created modify the project pom.xml to include the Flexmojos repository, as illustrated earlier. Finally run “mvn org.sonatype.flexmojos:flexmojos-maven-plugin:3.7.1:flexbuilder”.  This generates artifacts for Eclipse so that the project can be easily imported into it. The generated structure is as shown in Figure 9. To simply run “mvn flexmojos:flexbuilder” instead with its fully qualified name, add the following to settings.xml file within the “.m2” folder:

<pluginGroups>
  <pluginGroup>com.sonatype.maven.plugins</pluginGroup>
  <pluginGroup>org.sonatype.plugins</pluginGroup>
</pluginGroups>

 

Create the settings.xml file if it doesn’t already exist.

 

Folder structure and generated files after running “mvn flexmojos:flexbuilder”

 

To make sure this actually works and is Eclispe friendly, I open up the Eclipse instance with the Flash Builder plugin and try and import the project into it. Figure 10 to 14 show the steps involved in importing the project. Figure 13 shows that I use the latest version of Flash Builder but chose the Flex 3.5 SDK to keep things consistent. Once the project is available in Flash Builder, you can use Flash Builder to develop the application.

 

Import existing project into workspace

 

Select existing project from the file system

 

Project linked to the source on the file system

 

Choose Flex 3.5 SDK

 

Main.mxml of the project, as viewed in Flash Builder

 

So far we started with Flexmojos but that may not be the case always. If you start out with Flash Builder and would like to use Maven to build it without any modifications, then remember to configure the parameters like sourecDirectory and testDirectory appropriately in the pom.xml that you will define for the project.

So far we have looked at generating Flex application and library projects and importing Maven Flex projects into Flash Builder. Next, we take a Flex and an AIR project and use Maven to build it.

 

Building a Flex Application

First create a Flex 4 project using Flash Builder. I name it flex4app. Figure 15 shows a snapshot of the project create wizard.

 

Create flex4app, a Flex 4 application

 

I named my Application file Main.mxml. The contents of Main.mxml are as follows:

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
                                                         xmlns:s="library://ns.adobe.com/flex/spark"
                                                         xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">
                  <fx:Declarations>
                                    <!-- Place non-visual elements (e.g., services, value objects) here -->
                  </fx:Declarations>
                  <s:Button id="myButton" label="My Button"/>
</s:Application>

 

Flash Builder generates much of the code above. I only added the line that includes a Spark Button that had a label: “My Button”.

Next, add a pom.xml file at the root of the project. Add the following to pom.xml:

<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0"
  xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
  xsi:schemaLocation="http://maven.apache.org/POM/4.0.0
    http://maven.apache.org/maven-v4_0_0.xsd">
  <modelVersion>4.0.0</modelVersion>
 
  <groupId>com.treasuryofideas</groupId>
  <artifactId>flex4app</artifactId>
  <version>1.0-SNAPSHOT</version>
  <packaging>swf</packaging>
 
  <name>flex 4 app</name>

  <build>
    <sourceDirectory>src</sourceDirectory>
                 
    <plugins>
      <plugin>
        <groupId>org.sonatype.flexmojos</groupId>
        <artifactId>flexmojos-maven-plugin</artifactId>
        <version>3.7.1</version>
        <extensions>true</extensions>
                                    <dependencies>
          <dependency>
            <groupId>com.adobe.flex</groupId>
            <artifactId>compiler</artifactId>
            <version>4.0.0.14159</version>
            <type>pom</type>
          </dependency>
        </dependencies>
      </plugin>
    </plugins>
  </build>

  <dependencies>
    <dependency>
      <groupId>com.adobe.flex.framework</groupId>
      <artifactId>flex-framework</artifactId>
      <version>4.0.0.14159</version>
      <type>pom</type>
    </dependency>
  </dependencies>

  <repositories>
    <repository>
      <id>flexmojos</id>
      <url>http://repository.sonatype.org/content/groups/flexgroup/</url>
    </repository>
  </repositories>

</project>

 

Lets traverse through the contents of the pom file to see what we have added. The first few lines of the file are the XML/XSD schema and namespace definitions.  Then there are the four Maven co-ordinates: groupId, artifactId, version and packaging that identify the project. After the Maven coordinates is the name XML tag that attaches a name to the project. Besides what is already listed so far the pom file contains the following:

• build parameters – includes source directory and plugin defintions
• dependencies – specifies dependencies, if any
• repositories – in addition to the central Maven repository and required specifically for the project

Looking a little closely at the build parameters you will notice that the “sourceDirectory” points to “src” and not the default “src/main/flex”. The project source code resides in the “src” directory so this is required.  The build tags also specifies the plugin, which is org.sonatype.flexmojos:flexmojos-maven-plugin:3.7.1. Within the plugin definition additional dependency on a specific compiler is specified. By default, each plugin version supports a specific Flex compiler. However, one can explicitly specify a particular compiler version, if required. You can read more about this online here.

In my specific setup the Flex 4 SDK is version 4.0.0.14159 so that is the version of the Flex compiler the Flexmojos plugin is dependent on. You can look up your specific SDK version by expanding out the framework swc details in the “Flex Build Path” in your Eclipse/Flash Builder installation as shown in Figure 16.

 

Framework version as visible in the Flex Builder Path

 

If you scroll down to the section that specifies the dependencies, you will notice that the Flex framework dependency also specifies the same version: 4.0.0.14159. This is required to make sure the compiler and SDK versions are both specified correctly for the Flexmojos plugin to work without errors. The definition in the repository section is something you are already familiar with so I will skip explaining it again here.

Once the pom is ready and saved, open up a terminal window, browse to the folder where the pom is and run “mvn install”. Again, you should see Maven downloading and building, at the end of which you should see a message saying the build was successful. Once compete you should find flex4app-1.0-SNAPSHOT.swf in the newly created “target” directory within your project. Review Figure 17 and Figure 18 to find out the newer files and directories that “mvn install” creates.

 

flex4app project structure before running “mvn install”

 

flex4app project structure after running “mvn install”

 

If you open flex4app-1.0-SNAPSHOT.swf in a local Flash Player or a browser that has the Flash plugin installed then you should see a Flex application with a spark button labeled “My Button” as shown in Figure 19.

 

Flex 4 Application build using Maven

 

We have been running Flexmojos install build lifecycle goal for a while but haven’t really dug deeper into what all is running as a result of executing this goal. So, it may be worthwhile to note which exact goals are executed and in what order. Flexmojos follows the standard Maven build lifecycle but introduces three additional goals, namely, compile-swc, test-compile and test-run. The goals are executed in the following order:

1. resources:resources
2. flexmojos:compile-swc
3. resources:testResources
4. flexmojos:test-compile
5. flexmojos:test-run
6. install-install
7. deploy:deploy (which we don’t run as a part of mvn install)

 

When you use Flash Builder to compile a Flex application, you get the SWF and an html wrapper for the SWF. You can generate an html wrapper using Maven as well. All you have to do is include the following, within the plugin tags of your pom’s build tags:

<executions>
          <execution>
            <goals>
              <goal>wrapper</goal>
            </goals>
            <configuration>
              <parameters>
                <swf>${build.finalName}</swf>
                <width>100%</width>
                <height>100%</height>
              </parameters>
            </configuration>
          </execution>
        </executions>

 

and run “mvn install” again. Now you should see a number of newer files to support the html wrapper. Look at Figure 20 to see the project structure after generating the html wrapper. You will also see flex4app-1.0-SNAPSHOT.html that wraps the Flex application.

 

Flex4app project structure after mvn install with html wrapper

 

You can learn more about html wrapper and its possible configurations at the Flexmojos wiki: https://docs.sonatype.org/display/FLEXMOJOS/Html+Wrapper+Mojo

With a successful Flex 4 and Maven experience, lets move on to the last topic of this article, which illustrates building an AIR application with Maven.

 

Building an Adobe AIR application

Create an AIR application and name it airapp. Figure 21 depicts the first screen of the project creation wizard.

 

Create an AIR application

 

Add a pom.xml file to the root of the project. Add the following to pom.xml:

<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://
www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://
maven.apache.org/POM/4.0.0 http://maven.apache.org/maven-v4_0_0.xsd">
<modelVersion>4.0.0</modelVersion>
<groupId>com.treasuryofideas</groupId>
<artifactId>airapp</artifactId>
<version>1.0-SNAPSHOT</version>
<name>Flex 4 AIR Application</name>
<properties>
   <!-- the application name which must match the main mxml file
                  and application descriptor file names -->
   <application.name>Main</application.name>
   <flex.framework.version>4.0.0.14159</flex.framework.version>
   <keystore.file>${basedir}/cert4air.p12</keystore.file>
   <keystore.password>secret</keystore.password>
</properties>
<packaging>swf</packaging>
<build>
 <sourceDirectory>src</sourceDirectory>
 <plugins>
  <plugin>
    <groupId>org.sonatype.flexmojos</groupId>
    <artifactId>flexmojos-maven-plugin</artifactId>
    <version>3.7.1</version>
    <extensions>true</extensions>

    <dependencies>

      <dependency>
        <groupId>com.adobe.flex</groupId>
        <artifactId>compiler</artifactId>
        <version>${flex.framework.version}</version>
        <type>pom</type>
      </dependency>

      <dependency>
         <groupId>com.adobe.flex.compiler</groupId>
         <artifactId>adt</artifactId>
         <version>${flex.framework.version}</version>
      </dependency>
    </dependencies>

    <configuration>
      <!-- set this to true to allow the plugin to find the special Flex Builder/Flash Builder
      string in the application descriptor which is normally in site the <content> tag. If you set
      this to false or omit it entirely, the plugin will expect there to be an ${output} token
      in that tag. Placing that token in the application descriptor will prevent the Export Release
      Build function in Flex Builder/Flash Builder for working
      -->

      <flexBuilderCompatibility>true</flexBuilderCompatibility>

      <sourceFile>${application.name}.mxml</sourceFile>
      <descriptorTemplate>${basedir}/src/${application.name}-app.xml</descriptorTemplate>
      <keystore>${keystore.file}</keystore>
      <storepass>${keystore.password}</storepass>
 
      <!--optionally include files in the AIR package -->

      <includeFileSets>
            <fileSet>
              <directory>src/assets</directory>
              <includes>
                 <include>*.*</include>
              </includes>
            </fileSet>
      </includeFileSets>
    </configuration>

    <executions>
      <execution>
            <goals>
               <goal>sign-air</goal>
            </goals>
      </execution>
    </executions>

   </plugin>
 </plugins>
</build>

<dependencies>
<dependency>
  <groupId>com.adobe.flex.framework</groupId>
  <artifactId>air-framework</artifactId>
  <version>${flex.framework.version}</version>
  <type>pom</type>
</dependency>
</dependencies>

<repositories>
    <repository>
      <id>flexmojos</id>
      <url>http://repository.sonatype.org/content/groups/flexgroup/</url>
    </repository>
  </repositories>
</project>

 

Then set the version in the Main-app.xml to match the project version, 1.0-SNAPSHOT and create a folder named “assets” within the “src” folder. Figure 22 shows the project structure.

 

airapp Eclipse/Flash Builder project structure

 

Setting flexBuilderCompatibility to true, as in the pom above, should enable the plugin, alike Flash Builder, to correctly get the “content” value. However, if you still get errors because the “content” value isn’t correctly set then explicitly set the “content” tag value in Main-app.xml to ${output} as follows:

<initialWindow>
    ….
    <content>${output}</content>
    ….
</initialWindow>

 

AIR applications need to be signed before they can be packaged and distributed. Use adt, available in your Flex sdk to generate a certificate and self sign the AIR swf. You can generate the certificate as follows:

"/Applications/Adobe Flash Builder 4 Plug-in/sdks/4.0.0/bin/adt" -certificate -cn "My Certificate" -ou treasuryofideas.com -o "Treasury of Ideas LLC" -c US 1024-RSA cert4air.p12 secret

 

 

Make sure to set the parameters appropriate for your case. The parameters passed to adt are relevant for my specific environment.

Once generated, copy cert4air.p12 into the Flash Builder project and then run mvn install. That gets the job done. I will not illustrate the output of the build but you probably know to look for it in the target directory of the project.

There are many more aspects of using Maven to build and deploy Flex and AIR applications but I guess I have covered enough ground to get you started. Time now to conclude.

 

Conclusion

This brief introductory articles gets you started with Flex and Maven. Hope you feel confident using the two together now. The article isn’t exhaustive so there are still quite a few nuances that you will need to learn before you completely get rid of your alternative build tools and mechanisms. However, sorting the advanced bits should now be possible with the basics under control.

Flex up the Maven way!

 

About the Author

Shashank Tiwari is a technology entrepreneur, speaker, author, and innovator. He is the founder of Treasury of Ideas, a technology-driven innovation and value optimization company. He is adept in a multitude of technologies and his contributions to Java, Flex, Python and many open source tools and technologies have been well recognized over the years. Learn more about him at www.shanky.org or follow him @tshanky (twitter).