Flexのプロジェクトをインテグレーションしたい
プラットフォームは Hudson 一点でおk
なので、あとはどのようにインテグレーションの設定をしていくか、という話になります。
Hudson の環境設定
Java5 さえあれば Hudson は起動することが可能です*1。
まずは
Java5 の導入は適当にやるとして、以下から hudson.war をDLしましょう。
そうしたら、
java -jar hudson.war
で起動できます。デフォルトではポート 8080 で動くので、 localhost:8080 でアクセスしてみましょう。
ant の環境を用意する
自力で導入しても良いし、Hudson にも ant が付属してきていたと思うので、それを使えるようにしておきます。
Flex用インテグレーション環境を作る
FlexPMD
以下から取得します。今回は ant から実行するので ant 版で。コマンドラインから実行したい人は command line 版をDLしましょう。というか、両方落としておくと良いと思うw
あと、コマンドラインで実行したい人はPATHを通しておくと楽でしょう。
では ant タスクを書いて行きましょう
以下のような構成になっているとします。build ディレクトリに build 関係の設定ファイルを追加しておきます。
ちなみに、ここの flex-config.xml は player のバージョンとか、デバッグ用変数の定義とかを行います*4。
|-- README.txt |-- build | |-- build.xml | `-- flex-config.xml `-- src `-- hogehoge.mxml
build.xml にビルド用のタスクを既述します。以下の例では、
- build
- document
- pmd
- clean
- all
のタスクが登録されています。all をやると、clean をしてから build, document, pmd を実施してくれます。
実際の使い方は以下の通り
# build.xml が同じディレクトリにあり、build タスクを実行する場合(デフォルトタスクは省略できる)
%ant
# build.xml と違うディレクトリに居る場合
%ant -buildfile build/build.xml
# タスクを指定する場合
%ant clean
のような感じです。各タスクの名称やデフォルトの動作は build.xml の中で定義していきます。
そして、build.xml は以下のようになってます。
<?xml version="1.0" encoding="UTF-8"?> <project name="flexAnt" default="build" basedir="./"> <description> FlexAntを用いてAirのコンパイルを行います </description> <!-- 環境によって変更されるパスの設定 --> <property name="FLEX_HOME" value="/opt/flex/flex_sdk_3.4.0.9271"/> <property name="PMD_HOME" value="/opt/flex/flex-pmd-ant-task-1.0.RC4"/> <!-- プロジェクトのベースディレクトリ定義 --> <dirname property="XML_DIR" file="${ant.file}"/> <property name="APP_ROOT" value="${XML_DIR}/../"/> <property name="APP_SRC" value="${APP_ROOT}/src"/> <!-- 各コマンドのパス設定 --> <property name="ASDOC_EXE" value="${FLEX_HOME}/bin/asdoc"/> <!-- 出力先ディレクトリの設定 --> <property name="BIN_OUTPUT" value="${APP_ROOT}/bin"/> <property name="ASDOC_OUTPUT" value="${APP_ROOT}/asdoc"/> <property name="PMD_OUTPUT" value="${APP_ROOT}/pmd"/> <!-- アプリケーションの名前 --> <property name="APP_NAME" value="hogehoge"/> <!-- flex用Antタスクを読み込む --> <taskdef resource="flexTasks.tasks" classpath="${FLEX_HOME}/ant/lib/flexTasks.jar"/> <!-- FlexPMD タスクの定義 --> <taskdef name="flexPmd" classname="com.adobe.ac.pmd.ant.FlexPmdAntTask" > <classpath> <pathelement location="${PMD_HOME}/as3-parser-1.0.RC4.jar"/> <pathelement location="${PMD_HOME}/as3-parser-api-1.0.RC4.jar"/> <pathelement location="${PMD_HOME}/as3-plugin-utils-1.0.RC4.jar"/> <pathelement location="${PMD_HOME}/commons-lang-2.4.jar"/> <pathelement location="${PMD_HOME}/flex-pmd-ant-task-1.0.RC4.jar"/> <pathelement location="${PMD_HOME}/flex-pmd-core-1.0.RC4.jar"/> <pathelement location="${PMD_HOME}/flex-pmd-files-1.0.RC4.jar"/> <pathelement location="${PMD_HOME}/flex-pmd-command-line-1.0.RC4.jar"/> <pathelement location="${PMD_HOME}/flex-pmd-ruleset-1.0.RC4.jar"/> <pathelement location="${PMD_HOME}/flex-pmd-ruleset-api-1.0.RC4.jar"/> <pathelement location="${PMD_HOME}/plexus-utils-1.0.2.jar"/> <pathelement location="${PMD_HOME}/pmd-4.2.2.jar"/> </classpath> </taskdef> <!-- 全部入り動作 --> <target name="all" depends="clean,build,document,pmd" description="full build of project"/> <!-- mxmlcの実行 --> <target name="build"> <mkdir dir="${BIN_OUTPUT}" /> <mxmlc file="${APP_SRC}/${APP_NAME}.mxml" output="${BIN_OUTPUT}/${APP_NAME}.swf"> <load-config filename="${FLEX_HOME}/frameworks/flex-config.xml"/> <load-config filename="${APP_ROOT}/build/flex-config.xml"/> <source-path path-element="${FLEX_HOME}/frameworks"/> </mxmlc> </target> <!-- cleanの実行 --> <target name="clean"> <delete dir="${BIN_OUTPUT}" failOnError="false" includeEmptyDirs="true" /> <delete dir="${ASDOC_OUTPUT}" failOnError="false" includeEmptyDirs="true" /> <delete dir="${PMD_OUTPUT}" failOnError="false" includeEmptyDirs="true" /> </target> <!-- asdocの実行 --> <target name="document"> <mkdir dir="${ASDOC_OUTPUT}" /> <exec executable="${ASDOC_EXE}" failOnError="false"> <arg line='-source-path ${APP_SRC} ${FLEX_HOME}/frameworks/'/> <arg line='-doc-sources ${APP_SRC}'/> <arg line='-window-title "${APP_NAME}"'/> <arg line='-output ${ASDOC_OUTPUT}'/> </exec> </target> <!-- flex-pmd --> <target name="pmd"> <mkdir dir="${PMD_OUTPUT}" /> <flexPmd sourceDirectory="${APP_SRC}" outputDirectory="${PMD_OUTPUT}" /> </target> </project>
これを実行すると bin, asdoc, pmd ディレクトリができ、その中身成果物が生成されます。
あとは Hudson 上から実行するように ant 実行用の設定を書くだけです!
今後の展望
Flashエンジニアしてる都合上、サーバサイドよりフロントエンド側に携わる事が多い訳で、Flash 以外にも CI を展開しようとすると、残りの対象は JS か HTML になるんですよね。
HTML に関しては
Twitterで、HTML-lintのローカル版があるよ、と教えてもらった。Web経由だと機密情報だったりする場合もあるので使えないため、ローカルであるというのはとってもありがたい。
ただ、HTML-lint はヘルプに HTML5 が無いので、今後の Web 標準に対応していってくれるのか不安が残る。今現在作成するサイトであれば有用かもしれないが・・・。というか、W3C がコマンドライン用の作ってくれてれば良いんだが。
JS に関しては
まったくファックでよくわからない。
かろうじて見つけたのは以下のツール。とりあえず、WSHのコマンドライン版があるようなのでローカルでの使用という要件にはマッチするけれど、どの程度のものなのかはよくわからん。
というわけで
今後は
- FlexUnit でのユニットテストやっていきたいよ。
- HTML のコードチェックしたいよ
- JS のコードチェックしたいよ(HTMLよりは優先度低いけど)
という感じですかね。
一番上は自分で完結する範囲だけれど、その他は有効に使えればFlashチーム以外への啓蒙になるので、うまいことできる方法を探したいです。何か知っていたら教えて下しあ!><