The first step is to get familiar with the Flex SDK. If you’re a Flex developer, you’re likely already there, but you haven’t gotten your hands dirty inside the SDK code. Maybe you’ve monkey patched a flex bug. Regardless, working with the SDK is key to the bug fix.

I’m working on a windows client, so I am going to talk windows on the SDK setup. Fortunately, it’s easier to get up and running on OS X thanks to it’s Unix roots.

1. Download the Source Code. That means getting into the subversion database itself and checking out the latest code there.
   1. Install TortiseSVN, a tool that uses windows explorer as the window to the source control world.
   2. Create a directory (I used C:\osFlexSDK) to svn the source code to.
   3. Download Adobe’s Flex project skeleton and unzip it to the directory. This will give you the trunk, branches, & tags directories
   4. (for Flex 4 work) navigate to the flex\sdk folder and right click on the trunk. Select “SVN Update”
   5. (for Flex 3 work) right click on the branches directory and hover over “Tortoise SVN” and select repo-browser. right click on the 3.x folder and select checkout. Click “OK”.
2. Now that we have the source, it’s time to make sure we can build it. This is where I tripped up and saw some others tripped up at the BugQuash. Building should be a simple affair, especially since it’s just running ant from the command line. I’m using Adobe’s Setup on Windows guide as a baseline.
   1. Install Cygwin. The key is on the screen where you select the directory. On the bottom right of the screen there is a selection for Default Text File Type. You must select DOS/text.
      
   2. Install the proper Java SDK for your build 2.4.2_14 into C:\j2sdk1.4.2_14 for Flex 3 and 5.0_13 into C:\Program Files\Java\jdk1.5.0_13 for Flex 4
   3. Install Ant (a straight unzip) for your build 1.6.2 unzipped into C:/apache-ant-1.6.2/ for Flex 3 and 1.7.0 unzipped into C:/apache-ant-1.7.0/ for Flex 4
3. Now rig up the flash player for development use.
   1. Create the mm.cfg file in the C:\Documents and Settings\ directory if needed and add the following lines to it:
      ^?Download mm.cfg

      ErrorReportingEnable=1 TraceOutputFileEnable=1

   2. navigate to the C:\WINDOWS\system32\Macromed\Flash directory. Create a FlashPlayerTrust directory is there isn’t one there already and create a FlexSDK.cfg file with the following line:
      ^?Download FlexSDK.cfg

      C:\

      You can change drives or even directories if you aren’t using the C drive for development, or even have multiple drives. Adobe suggests being as restrictive as possible for security reasons.

4. Test your setup. This is the “easiest” part since it’s pretty much a pass/fail.
   1. Run cygwin shell and navigate to the folder you want to build. Note: All drives are under /cygdrive so c:\osFlexSDK\flex\sdk\trunk is /cygdrive/c/osFlexSDK/flex/sdk/trunk.
   2. Type “source setup.sh’ to set up the environment variables
   3. Test Java by typing “java -version” and make sure you’re on the right version for your build. If it reports and error, make sure you installed Java in the correct directory.
   4. Test ant by typing “ant-version” and make sure you’re on the right version for your build. If it reports and error, make sure you unzipped ant in the correct directory.
   5. If everything checks out, type “ant” and let the build happen
5. You should now have a built Flex SDK in the bin directory. Congratulations!

This is continued in part 2

Related Posts (generated):

• Flash Builder 4 delay doesn’t impact Catalyst
• Autobuilding a Flex app from an svn repository
• Bug Quash
• Scientific Notation Patch Accepted
• Flex OIM review

1. Install Apache Ant – The build tool that binds it all together. If you’re not familiar with Ant, it makes Flex compiling much easier. It’s somewhat like Make, but with plugins that make magic work (as we’ll see) so we can use ant to do everything rather than worry about command line tools.
2. Test ant out by opening a command line and typing “ant”. You should get a message about a build.xml file not existing.
3. Create your working directory. Something like “C:\autobuild\”. I’ll refer to it as the autobuild directory from here out
4. Create a “libs” directory under autobuild. Since we don’t want to mess up your ant installation, we’re going to leave it alone.
5. Create a “source” directory under autobuild. Go ahead and check out you latest into it since we’ll use it to test the flex copiler.
6. Install the Flex SDK – Since you’re reading this, you’ve probably already got this going. This is so we can use the Flex Ant Tasks to automate the compilation of the source code. To do this, goto you flex_builder_install/sdks/version/ant directory and copy the flexTasks.jar files to autobuild/libs directory you just created.
7. Create a text file named build.properties in the autobuild directory. This is where the ant global variables are defined. You must have a FLEX_HOME defined to use the Flex And Tasks and can define others to make your build file easier to understand. This is probably something along the lines of:
   ^?View Code TEXT

   # Where Flex lives FLEX_HOME=C:/Program Files/Adobe/Flex Builder 3 Plug-in/sdks/3.2.0   # Where the Flex framework we want to compile with lives FRAMEWORK=${FLEX_HOME}/frameworks   # Directory where the app will be deployed DEPLOY_DIR=./deploy   # Directory where the app will be deployed SVN_DIR=./code

8. Create a text file named build.xml in the autobuild directory. This is where you can define all your settings to make ant work. The file should just be a reference to the build.properties, flexTasks, and then the mxmlc command:
   ^?View Code XML

   <?xml version="1.0"?> <project default="main" basedir="."> <path id="classpath" > <fileset dir="${basedir}/libs/"> <include name="*.jar" /> </fileset> </path> <property file="${basedir}/build.properties" /> <taskdef resource="flexTasks.tasks"/> <target name="main"> <echo >Using framework from: ${FLEX_HOME}</echo> <mxmlc file="${SVN_DIR}/FlexApp.mxml" output="${DEPLOY_DIR}/FlexApp.swf" use-network="true" actionscript-file-encoding="UTF-8" keep-generated-actionscript="false" debug="false" locale="en_US" incremental="true" show-actionscript-warnings="false" > <load-config filename="${FRAMEWORK}/flex-config.xml" /> <source-path path-element="${FRAMEWORK}" /> </mxmlc> </target> </project>

   Then, from the autobuild directory run “ant” and make sure you get a swf in the autobuild/bin directory. If you get a Java heap space error, you’ll have to increase Ant’s memory with a “set ANT_OPTS=-Xmx1024m” command on the command line before running ant to create an environment variable that will make Ant use more memory.

9. Now that we can compile the source, it’s time to make svn work. This is a little trickier but SvnAnt helps out. SvnAnt is the most complicated step, but it’s what makes the magic happen. Go ahead and download the zip file, and copy the svnant.jar, svnClientAdapter.jar, and scnjavahl.jar files into your libs directory
10. You’ll also need a JavaHL to make it work. Specifically the libsvnjavahl-1.dll from this zip will work. If there’s a better route to the file, let me know. Place the libsvnjavahl-1.dll file in the autobuild directory
11. Finally update your build.xml file. Below the project tag add
    ^?View Code XML

    <path id="classpath" > <fileset dir="${basedir}/libs/"> <include name="*.jar" /> </fileset> </path> <typedef resource="org/tigris/subversion/svnant/svnantlib.xml" classpathref="classpath" />

    And then, between your target and mxmlc tags add

    ^?View Code XML

    <svn username="svnuser" password="svnpass"> <checkout url="url/to/Repos" destPath="${SVN_DIR}" /> </svn>

12. Now to test SVN. go ahead and delete everything in your bin and source directories and type “ant” from the command line. You should see a big checkout, then a compile, and get a swf in the bin directory. if there was a problem, check your svn path and make sure you’re checking out the proper directory and not getting the full svn tree
13. Now that we have a checkout and build, we just need to ftp the swf onto our server. Ant’s FTP lib will do that wonderfully, we just have to get the proper jar files since they’re not included in the default ant setup. You can download the Jakarta Commons Net binary and then copy the commons-net-2.0.jar and commons-net-ftp-2.0.jar file to your autobuild/libs directory
14. Update your build.xml file with a new taskdef (just place it below the flexTasks one):
    ^?View Code XML

    <taskdef name="ftp" classname="org.apache.tools.ant.taskdefs.optional.net.FTP" />

    And then actually create an ftp task after the build step:

    ^?View Code XML

    <ftp server="{server}" userid="{server}" password="{ftpPassword}" remotedir="{dir for swf}" passive="yes"> <fileset dir="${DEPLOY_DIR}"> <include name="**/*.swf"/> </fileset> </ftp>

15. The final Ant step is to test it all. Because of the way the Ant FTP library works you have to use “ant -lib libs” to load the commons-net files. You should see a [ftp] action after the [mxmlc] reports the file name and the file should show up on your server. If it does, everything worked out and you’ve automated your build & deployment. Now you just need to trigger it
16. First, create a batch file to call Ant and make sure everythings set up properly. Mine looks like this:
    ^?View Code TEXT

    c: cd C:\autobuild set ANT_OPTS=-Xmx1024m ant -lib "libs"

17. I use Commit Monitor which is a SVN repository monitor than can be set up to check the repository on a schedule and, if changes are found, run a program (or in this case, a batch file). Go ahead and install it and set the batch file to run when new commits are detected.
18. Sit back and watch the magic happen

Just to make it simpler, here are the files we created:

 #SVN location
 urlRepos=<svn address>
 
 # Where Flex lives
 FLEX_HOME=C:/Program Files/Adobe/Flex Builder 3 Plug-in/sdks/3.2.0
 
 # Where the Flex framework we want to compile with lives
 FRAMEWORK=${FLEX_HOME}/frameworks
 
 # Directory where the app will be deployed
 DEPLOY_DIR=./bin
 
 # Directory where the app will be deployed
 SVN_DIR=./source
 
 # Server to upload completed swf
  HOST_SERVER=<serverURL>

<?xml version="1.0"?>
<project default="main" basedir=".">
	<path id="classpath" >
		<fileset dir="${basedir}/libs/">
			<include name="*.jar" />
		</fileset>
	</path>
	<typedef resource="org/tigris/subversion/svnant/svnantlib.xml" classpathref="classpath" />
 
    <property file="${basedir}/build.properties" />
	<taskdef resource="flexTasks.tasks"/>
	<taskdef name="ftp" classname="org.apache.tools.ant.taskdefs.optional.net.FTP" />
 
	<target name="main">
		<svn username="svnuser" password="svnpass">
			<checkout url="${urlRepos}" destPath="${SVN_DIR}" />
		</svn>
		<echo >Using framework from: ${FLEX_HOME}</echo>
		<mxmlc 	file="${SVN_DIR}/FlexApp.mxml" 
				output="${DEPLOY_DIR}/FlexApp.swf" 
				use-network="true" 
				actionscript-file-encoding="UTF-8" 
				keep-generated-actionscript="false" 
				debug="false" 
				locale="en_US"
				incremental="true" 
				show-actionscript-warnings="false" >
			<load-config filename="${FRAMEWORK}/flex-config.xml" />
			<source-path path-element="${FRAMEWORK}" />
		</mxmlc>
		<ftp 	server="{server}"
				userid="{server}"
				password="{ftpPassword}"
				remotedir="{dir for swf}"
				passive="yes">
			<fileset dir="${DEPLOY_DIR}">
			  <include name="**/*.swf"/>
			</fileset>
		</ftp>
	</target>
</project>

c:
cd C:\autobuild
set ANT_OPTS=-Xmx1024m
ant -lib "libs"

Related Posts (generated):

• Bug hunting in the Flex SDK (part 1)
• Scientific Notation Patch Accepted
• Flex OIM review
• Flex Open Iteration Meeting
• ObjectUtil.compare() Patch 3 (with feeling!)