Pré-requis

Vous aurez besoin ici :

• d'un SDK Flex (j'utilise le SDK 2.0.1 HotFix 1)
• de Java 1.4 ou plus
• de Maven 2 (dernière version ; 2.0.7 dans ce tutoriel)

Je ne reviendrai pas sur l'installation de Java ou du SDK Flex. Concernant Maven 2, si ce n'est pas déjà fait, passez à la suite...

Installer Maven 2

Téléchargement

Rendez-vous sur le site officiel pour télécharger la dernière version.

Installation

Décompressez l'archive dans le répertoire de votre choix. Chez moi, c'est E:\Dev\maven-2.0.7.

Création du fichier start.cmd

Attention, il s'agit de passer l'espace d'un instant du côté obscur de la force : la ligne de commandes. Pour certains, c'est du bonheur, pour d'autres, c'est l'angoisse. Mais ne vous inquiétez pas, tout va bien se passer.

A quoi sert ce fichier ? A ouvrir une invite de commande MSDOS au sein de laquelle les différentes variables d'environnement nécessaires au bon fonctionnement de l'ensemble seront positionnées. En gros, c'est pour éviter d'avoir des problèmes au moment d'exécuter maven.

Contenu du fichier start.cmd (à adapter en fonction de l'endroit où sont installés les différents composants) :

set M2_HOME=E:\Dev\maven-2.0.7
set JAVA_HOME=E:\Dev\jdk1.5.0_12
set FLEX_HOME=E:\Dev\FlexSDK
set PATH=%PATH%;%M2_HOME%\bin;%FLEX_HOME%\bin
call cmd

Enregistrez-le où vous voulez et lancez-le (attention, ça pique les yeux). Tapez mvn --version, puis mxmlc --version vous devez voir environ ceci :

Attention ! Pas d'espaces dans le chemin FLEX_HOME, sinon vous allez au devant de problèmes.

D'autre part, le plugin de compilation est très sensible aux espaces dans les chemins : veillez donc à modifier le chemin de stockage du repository local de maven 2. Pour cela,

• rendez-vous dans M2_HOME/conf et éditez le fichier settings.xml
• Décommentez la première ligne de configuration <localRepository>/path/to/local/repo</localRepository> et indiquez-y un chemin SANS ESPACES
• Sauvegardez le fichier et relancez votre fenêtre de commandes MS-DOS

A noter pour la suite du tuto que l'ensemble des commandes sont lancées à partir d'une invite de commandes ouverte via ce petit script. De cette manière toutes les variables "qui vont bien" sont prêtes.

C'est tout bon ? On continue... Sinon, il prend son aspirine et relit le tout tranquillement :).

Préparer votre repository local

Voilà, vous avez Maven 2 (vous pourrez briller dans une réunion de geek). Maintenant, encore plus classe : le customiser. Non, nous ne parlons pas de la jackytouch de l'informatique, mais simplement d'adapter votre installation à l'usage du plugin Flex 2 de ServeBox. Pour une présentation plus conceptuelle, je vous invite à consulter l'article sur Maven 2 et Flex 2.

Pour information : la page d'accueil du plugin développé par ServeBox.

En suivant les instructions proposées sur le site de ServeBox, nous allons installer les librairies du SDK Flex dans le repository maven 2. De cette manière elles seront utilisables en tant que dépendances dans le POM. Pour ce faire, et si vous avez bien positionné la variable d'environnement FLEX_HOME à la racine de votre installation du SDK, vous pouvez exécuter les commandes suivantes :

mvn install:install-file -DgroupId=adobe-flex2 -DartifactId=automation -Dversion=2.0.1 -Dfile=%FLEX_HOME%/frameworks/libs/automation.swc -Dpackaging=swc

mvn install:install-file -DgroupId=adobe-flex2 -DartifactId=automation_charts -Dversion=2.0.1 -Dfile=%FLEX_HOME%/frameworks/libs/automation_charts.swc -Dpackaging=swc

mvn install:install-file -DgroupId=adobe-flex2 -DartifactId=charts -Dversion=2.0.1 -Dfile=%FLEX_HOME%/frameworks/libs/charts.swc -Dpackaging=swc

mvn install:install-file -DgroupId=adobe-flex2 -DartifactId=flex -Dversion=2.0.1 -Dfile=%FLEX_HOME%/frameworks/libs/flex.swc -Dpackaging=swc

mvn install:install-file -DgroupId=adobe-flex2 -DartifactId=framework -Dversion=2.0.1 -Dfile=%FLEX_HOME%/frameworks/libs/framework.swc -Dpackaging=swc

mvn install:install-file -DgroupId=adobe-flex2 -DartifactId=playerglobal -Dversion=2.0.1 -Dfile=%FLEX_HOME%/frameworks/libs/playerglobal.swc -Dpackaging=swc

mvn install:install-file -DgroupId=adobe-flex2 -DartifactId=rpc -Dversion=2.0.1 -Dfile=%FLEX_HOME%/frameworks/libs/rpc.swc -Dpackaging=swc

mvn install:install-file -DgroupId=adobe-flex2 -DartifactId=utilities -Dversion=2.0.1 -Dfile=%FLEX_HOME%/frameworks/libs/utilities.swc -Dpackaging=swc

mvn install:install-file -DgroupId=adobe-flex2.locales.en_US -DartifactId=charts_rb -Dversion=2.0.1 -Dfile=%FLEX_HOME%/frameworks/locale/en_US/charts_rb.swc -Dpackaging=swc

mvn install:install-file -DgroupId=adobe-flex2.locales.en_US -DartifactId=fds_rb -Dversion=2.0.1 -Dfile=%FLEX_HOME%/frameworks/locale/en_US/fds_rb.swc -Dpackaging=swc

mvn install:install-file -DgroupId=adobe-flex2.locales.en_US -DartifactId=framework_rb -Dversion=2.0.1 -Dfile=%FLEX_HOME%/frameworks/locale/en_US/framework_rb.swc -Dpackaging=swc

mvn install:install-file -DgroupId=adobe-flex2.locales.en_US -DartifactId=fds_rb -Dversion=2.0.1 -Dfile=%FLEX_HOME%/frameworks/locale/en_US/fds_rb.swc -Dpackaging=swc

Rappel : veillez à lancer l'invite de comande MS-DOS via notre fichier start.cmd créé un peu plus haut, avant d'exécuter les commandes en question. Il est possible que certaines lignes retournent une erreur si vous n'avez pas installé les Charting Components

Note : la première fois, c'est un peu plus long (pas de blague graveleuse sur la difficulté de la première fois s'il vous plaît), mais les fois d'après ça va plus vite (tut tut tut, j'ai dit pas...)

En lisant les lignes de loin, on constate qu'il ne s'agit que d'intégrer les swc de Flex dans le repository local. Je ne parle pour le moment pas de la partie FlexUnit proposée pourtant avec le plugin. Cela fera probablement l'objet d'un autre post : à chaque jour suffit sa peine.

Premier projet

La structure maven 2

Maven 2 propose une arborescence type pour les projet de manière à standardiser les différentes tâches inhérentes à tout projet. Pour cela :

• créez l'arborescence suivante : src/main/flex. Il s'agit là du chemin où seront stockées les sources Flex du projet.
• créez ensuite un fichier Main.mxml contenant le code suivant :

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" 
layout="absolute">
    <mx:Panel title="Maven et Flex" width="400" height="300">
        <mx:Label text="Première appli Flex compilée via Maven 2" mouseDownEffect="WipeRight"/>
    </mx:Panel>
</mx:Application>

Le POM

A présent, nous avons une structure de projet simple. Il nous manque cependant le fichier pom.xml permettant de décrire notre projet. Créez, au même niveau que le répertoire src, un fichier pom.xml contenant les lignes suivantes :

<?xml version="1.0" encoding="UTF-8"?>

<project>
	<modelVersion>4.0.0</modelVersion>
	<name>Demo application Flex</name>
	<groupId>com.lafabrick</groupId>
	<artifactId>demo</artifactId>
	<version>1.0</version>

 	<packaging>swf</packaging>

 	<description>Premier SWF avec Maven 2</description>

 	<pluginRepositories>

 		<pluginRepository>
	 		<id>central</id>
 			<name>Central Maven Repository</name>
 			<url>http://repo1.maven.org/maven2</url>
 		</pluginRepository>

 		<pluginRepository>
	 		<id>maven-snapshots</id>
	 		<name>Maven Snapshots Repository</name>
	 		<url>http://snapshots.maven.codehaus.org/maven2</url>
 		</pluginRepository>

 		<pluginRepository>
 			<id>ServeBox</id>
	 		<name>ServeBox Repository</name>
	 		<url>http://www.servebox.com/maven</url>
 		</pluginRepository>

 	</pluginRepositories>

	<build>
 	<plugins>

 		<plugin>
 			<groupId>org.servebox.flex2</groupId>
 			<artifactId>flex2-plugin</artifactId>
 			<version>0.9.1</version>
 			<extensions>true</extensions>
 			<configuration>
 				<sourceDirectory>/src/main/flex</sourceDirectory>
 				<mxmlFile>src/main/flex/Main.mxml</mxmlFile>
 			</configuration>
 		</plugin>

	</plugins>

	</build>

	<dependencies>

		<dependency>
			<groupId>adobe-flex2</groupId>
			<artifactId>automation</artifactId>
			<version>2.0.1</version>
			<type>swc</type>
		</dependency>
		<dependency>
			<groupId>adobe-flex2</groupId>
			<artifactId>automation_charts</artifactId>
			<version>2.0.1</version>
			<type>swc</type>
		</dependency>
		<dependency>
			<groupId>adobe-flex2</groupId>
			<artifactId>charts</artifactId>
			<version>2.0.1</version>
			<type>swc</type>
		</dependency>
		<dependency>
			<groupId>adobe-flex2</groupId>
			<artifactId>flex</artifactId>
			<version>2.0.1</version>
			<type>swc</type>
		</dependency>
		<dependency>
			<groupId>adobe-flex2</groupId>
			<artifactId>framework</artifactId>
			<version>2.0.1</version>
			<type>swc</type>
		</dependency>
		<dependency>
			<groupId>adobe-flex2</groupId>
			<artifactId>rpc</artifactId>
			<version>2.0.1</version>
			<type>swc</type>
		</dependency>
		<dependency>
			<groupId>adobe-flex2</groupId>
			<artifactId>utilities</artifactId>
			<version>2.0.1</version>
			<type>swc</type>
		</dependency>
		<dependency>
			<groupId>adobe-flex2.locales.en_US</groupId>
			<version>2.0.1</version>
			<artifactId>charts_rb</artifactId>
			<type>swc</type>
		</dependency>
		<dependency>
			<groupId>adobe-flex2.locales.en_US</groupId>
			<version>2.0.1</version>
			<artifactId>fds_rb</artifactId>
			<type>swc</type>
		</dependency>
		<dependency>
			<groupId>adobe-flex2.locales.en_US</groupId>
			<version>2.0.1</version>
			<artifactId>framework_rb</artifactId>
			<type>swc</type>
		</dependency>
	</dependencies>
</project>

Ce POM décrit un projet simple dépendant des librairies de Flex (Charting Components compris, retirez les dépendances associées si vous ne les avez pas installés).

Rappel de l'arborescence finale du projet :

avec, dans demo-flex :

Premier test

Ouvrez une ligne de commande à l'aide du fichier start.cmd et tapez la ligne suivante mvn clean package. Cette ligne demande le nettoyage, la compilation et le packaging des sources en SWF via maven 2.

Le résultat consiste en un fichier demo-1.0.swf dans le répertoire target de votre projet.

Ca y est vous avez compilé votre premier projet avec maven 2. Mais jusqu'ici, il n'y a pas pas grand intérêt : j'aurais tout aussi bien pu compiler le projet en question en ligne de commande avec mxmlc. Oui, sauf que, maintenant, si j'ajoute le SWC de Cairngorm à mon repository :

mvn install:install-file -DgroupId=adobe-labs -DartifactId=cairngorm -Dversion=2.2 -Dfile=/chemin/vers/cairngorm.swc -Dpackaging=swc

et que j'ajoute cette dépendance au projet :

<dependency>
	<groupId>adobe-labs</groupId>
	<artifactId>cairngorm</artifactId>
	<version>2.2</version>
	<type>swc</type>
</dependency>

que je sauvegarde le tout et que je relance la compilation, elle tiendra compte de l'usage de la librairie cairngorm.

Ouverture

Si vous souhaitez utiliser des librairies SWC dans vos projets Flex (Cairngorm, WiiFlash, FlexBook, flex-lib...) il vous suffit de les installer dans votre repository local et d'utiliser le système de dépendances de Maven 2.

Une autre possibilité offerte par le plugin consiste en la compilation non pas d'un SWF mais d'un SWC (donc d'une librairie Flex). Imaginez le cas de figure suivant :

Vous créez une librairie "MonSuperFramework.swc" qui utilise disons la flex-lib. Vous aurez un projet Flex résultant en un SWC avec un POM ressemblant à celui-ci :

<?xml version="1.0" encoding="UTF-8"?>
<project>
	<modelVersion>4.0.0</modelVersion>
	<name>Mon super framework</name>
	<groupId>com.chezmoi</groupId>
	<artifactId>monSuperFramework</artifactId>
	<version>1.0</version>

	<packaging>swc</packaging>

	<description>Mon framework qui envoie du gros</description>

	[...]

	<dependencies>

	[...]


		<dependency>
			<groupId>adobe-flex2.locales.en_US</groupId>
			<version>2.0.1</version>
			<artifactId>framework_rb</artifactId>
			<type>swc</type>
		</dependency>
		<dependency>
			<groupId>org.flexlib</groupId>
			<artifactId>flexlib</artifactId>
			<version>2.3.1</version>
			<type>swc</type>
		</dependency>
	</dependencies>
</project>

Installez alors ce SWC dans votre repository local en vous basant sur l'une des commandes ci-dessus à laquelle vous ajoutez -DpomFile=chemin/vers/mon/pom.xml.

Vous pouvez à présent utiliser comme dépendance d'un projet Flex votre super framework comme ceci :

     <dependencies>
	    	<dependency>
	    		<groupId>com.chezmoi</groupId>
	    		<artifactId>monSuperFramework</artifactId>
	    		<version>1.0</version>
	    		<type>swc</type>
	    	</dependency>
     </dependencies>

et bénéficier automatiquement de l'ajout de toutes les dépendances nécessaire au build path (framework Flex + flexlib), pratique !

Bien entendu, ce genre de cas de figure est intéressant à prendre en compte dans un cadre de développement à plusieurs, où la mutualisation des développements par librairies est très présente. Cela demande donc une certaine organisation, mais résulte en un gain de temps très intéressant.

Alors, à vos commandes, et bon Flex !