CruiseControl com SVN – Parte 02

March 17th, 2010  |  Published in metodologia, programação

Então alguém na sua empresa tem um projeto em Flex, e quer configurá-lo no CruiseControl ?!
Sei..  nós também já passamos por isso.

A primeira coisa a ser feita é colocar a lib do flex-tasks no classpath do ant, para podermos executar as tasks flex no build do nosso projeto. A forma mais fácil de fazer isso é copiando a lib {FLEX_HOME}/ant/lib/flexTasks.jar para diretório de libs da instalação do ant {ANT_HOME}/lib.
Então, para você poder utilizar as tasks flex, basta incluir as linhas abaixo no seu arquivo de build:

<taskdef resource="flexTasks.tasks" classpath="${ant.home}/lib/flexTasks.jar" />
<property name="FLEX_HOME" value="${flex.home}" />

Feito isso você já pode compilar os seus componentes, módulos e quase toda parafernália de um projeto flex tradicional. Para compilar os seus módulos flex, você pode utilizar o <mxmlc>,  indicando o seu .mxml de entrada e o .swf de saída. No meu caso ficou mais ou menos assim:

<!-- compila o modulo flex modules/WhiteboardEditModule.mxml  -->
 <target name="compile-flex-whiteboard-module" depends="compile-java">
 <echo message="${ant.project.name}: Compilando WhiteboardEditModule.mxml ..."/>
 <mxmlc  file="${project.path}/wedoWeb/flex_src/modules/WhiteboardEditModule.mxml"
 output="${project.path}/wedoWeb/output/modules/WhiteboardEditModule.swf"
 keep-generated-actionscript="false"
 incremental="true"
 debug="true"
 allow-source-path-overlap="true"
 show-actionscript-warnings="false"
 show-binding-warnings="false"
 services="${project.path}/wedoWeb/WebContent/WEB-INF/flex/services-config.xml">

 <target-player>10.0.0</target-player>
 <actionscript-file-encoding>"UTF-8"</actionscript-file-encoding>
 <load-config filename="${flex.home}/frameworks/flex-config.xml"/>

 <library-path dir="${flex.home}/frameworks/libs" append="true">
 <include name="*.swc" />
 </library-path>
 <library-path dir="${project.name}/flex_libs" append="true">
 <include name="*.swc" />
 </library-path>

 <locale>pt_BR</locale>
 <locale>en_US</locale>
 <locale>es_ES</locale>
 <source-path path-element="${project.path}/wedoWeb/flex_src" />
 <source-path path-element="${project.path}/Whiteboard/src"/>
 <source-path path-element="${project.path}/wedoWeb/locale/{locale}"/>

 <include-resource-bundles>nous</include-resource-bundles>
 <include-resource-bundles>SharedResources</include-resource-bundles>
 <include-resource-bundles>formatters</include-resource-bundles>
 </mxmlc>
 </target>

É importante indicar o arquivo services-config.xml, ele define algumas diretrizes de compilação do projeto, também relacionadas a utilização da aplicação sobre https. ( é isso né John, vc não vai me fazer passar por mentiroso aqui ?!)

services="${project.path}/wedoWeb/WebContent/WEB-INF/flex/services-config.xml">

Além de indicar o arquivo de configuração do flex, é importante configurar a versão do flashplayer sendo utilizada e o file encoding dos actions scripts. Se você não configurar essas opções… bem, nesse caso coisas estranhas vão acontecer.

<target-player>10.0.0</target-player>
 <actionscript-file-encoding>"UTF-8"</actionscript-file-encoding>
 <load-config filename="${flex.home}/frameworks/flex-config.xml"/>

Por incrível que pareça, a parametrização de intercionalização do projeto, foi mais fácil do que eu esperava. No nosso caso, o sistema está disponível em 3 idiomas.  Bastaram mais umas linhas, e tudo certo.

<locale>pt_BR</locale>
 <locale>en_US</locale>
 <locale>es_ES</locale>
 <source-path path-element="${project.path}/wedoWeb/flex_src" />
 <source-path path-element="${project.path}/Whiteboard/src"/>
 <source-path path-element="${project.path}/wedoWeb/locale/{locale}"/>

<include-resource-bundles>nous</include-resource-bundles>
 <include-resource-bundles>SharedResources</include-resource-bundles>
 <include-resource-bundles>formatters</include-resource-bundles>

Para compilar os demais módulos flex do seu projeto, a história se repte, é só mandar um <mxmlc> da mesma forma como fizemos aí em cima.

Depois disso,  ainda é preciso gerar o arquivo html principal da aplicação, sim.. aquele objeto que traz consigo o .swf dentro dele: o html-wrapper. O elemento <html-wrapper> gera pra você o index.html e AC_OETags.js, que serão necessários no deploy da aplicação. Além disso ele pode gerar o resto da parafernália (adoro a pronúncia dessa palavra: pa-ra-fer-ná-li-a …), como os arquivos historyFrame.html, history.css e history.js

<!-- Gera html-wrapper  -->
 <target name="wrapper-flex-html" depends="compile-flex-wedoWeb-module">
 <echo message="${ant.project.name}: Gerando html-wrapper ..."/>
 <html-wrapper
 title=""
 file="wedoWeb.html"
 height=""
 width=""
 bgcolor=""
 application=""
 swf=""
 version-major=""
 version-minor=""
 version-revision=""
 history="true"
 template="express-installation"
 output="${project.name}/output"/>

 <html-wrapper
 title=""
 file="wedoTest.html"
 height=""
 width=""
 bgcolor=""
 application=""
 swf=""
 version-major=""
 version-minor=""
 version-revision=""
 history="true"
 template="express-installation"
 output="${project.name}/output"/>

 </target>

O problema é que no nosso caso, já temos um index.template.html, que é utilizado na geração do html principal da aplicação. Por isso eu utilizei o <html-wrapper> apenas para geração da parafernália (novamente…) de arquivos AC_OETags.js, historyFrame.html, history.css, history.js e o index.html padrão. Depois bastaram alguns ctrl-c, ctrl-v para os passar os parãmetros do template para o meu recém criado wedoWeb.html.

<target name="copy-html-template" depends="wrapper-flex-html">
 <echo message="${ant.project.name}: Gerando wedoWeb.html ..."/>
 <delete file="wedoWeb/output/wedoWeb.html"/>
 <copy file="${project.name}/html-template/index.template.html"    tofile="${project.name}/output/wedoWeb.html" />
 <replace file="${project.name}/output/wedoWeb.html" token="$${title}" value=""/>
 <replace file="${project.name}/output/wedoWeb.html" token="$${swf}" value="wedoWeb"/>
 <replace file="${project.name}/output/wedoWeb.html" token="$${width}" value="100%"/>
 <replace file="${project.name}/output/wedoWeb.html" token="$${height}" value="100%"/>
 <replace file="${project.name}/output/wedoWeb.html" token="$${bgcolor}" value="#869ca7"/>
 <replace file="${project.name}/output/wedoWeb.html" token="$${application}" value="wedoWeb"/>
 <replace file="${project.name}/output/wedoWeb.html" token="$${version_major}" value="10"/>
 <replace file="${project.name}/output/wedoWeb.html" token="$${version_minor}" value="0"/>
 <replace file="${project.name}/output/wedoWeb.html" token="$${version_revision}" value="0"/>

Claro, antes disso ainda precisei manipular alguns arquivos… uns pra lá outros pra cá…  pra poder gerar o .war do jeito que eu queria. Mas isso também vai depender muito da estrutura do seu projeto.

Bem, acho que é isso. Depois é compilar todos os componentes e módulos flex, juntar tudo com o seu código fonte java,  empacotar o .war e “voilà”, temos o um projeto flex compilável.

Logo após as primeiras tentivas e alguns java.lang.OutOfMemoryError: Java heap space , precisei configurar a quantidade de memória para utlização do ANT. No script de inicialização, ant.bat, adicionei a linha abaixo e o problema foi resolvido.

   ANT_OPTS=-Xms512m -Xmx1024m -XX:PermSize=256m -XX:MaxPermSize=256m

Mas depois foi só correr pro abraço…

De qualquer forma, eu conheço de flex o quanto jogo de futebol, então se quiserem uma referência mais segura em desenvolvimento flex, é melhor darem uma olhada no blog do John.

Leave a Response