태터데스크 관리자

도움말
닫기
적용하기   첫페이지 만들기

태터데스크 메시지

저장하였습니다.

Flex Ant Task를 이용한 자동화 빌드 구축하기
 
Flex Builder를 사용할경우 Application,Library 규모가 커지면 커질수로 컴파일 시간이 기하급수적으로 증가한다. 아직까지 안정화 작업이 덜된듯. 필자 또한 중간중간 빌드가 멈추거나 하는 현상들이 자주 발생을 하였다. 그래서 Builder 실행시 메모리 옵션을 추가하여 약간의 성능 향상을 느낄수 있었지만 이것 또한 대안이 될수는 없었다.
결구 Flex Ant Task를 사용하여 Ant로 자동화 빌드를 구축하여 어느정도 컴파일 시간을 단축할 수가 있었다.
이제부터 Flex Ant Task를 사용하여 프로젝트 빌드 자동화를 구축해보자.

Flex Ant Task를 설치하자.

Ant 설치
Ant 1.7.0 다운로드 : http://ant.apache.org/bindownload.cgi
압축파일을 풀고 ant의 bin폴더를 패스에 추가하자
환경변수 패스 추가 : c:\ant1.7.0\bin
[그림1]

설치된 Ant 실행 테스트
커멘드 창을 띄운다음 “ant”를 실행한다. 정의된 build.xml이 없기 때문에 오류 메시지가 발생을 할 것이다.
[그림2]

Ant 설치가 완료되었다.

Flex Ant Task 설치
Flex Ant Task 다운로드 : http://labs.adobe.com/wiki/index.php/Flex_Ant_Tasks
[그림3]

다운받은 파일의 압축을 풀고 lib/flexTasks.jar파일을 사용하면 된다.

Ant Task
    1. Mxmlc : Flex applications, modules, CSS SWF file들을 컴파일 할 때 사용하는 Task
    2. Compc : SWC,RSL들을 컴파일 할 때 사용하는 Task
    3. html-wrapper :html-wrapper 파일들을 자동생성 할 때 사용하는 Task

Ant에서 Flex Task 사용방법
    1. taskdef를 사용하여 “flexTasks.tasks”를 추가한다.
       <taskdef resource="flexTasks.tasks" classpath="${basedir}/flexTasks/lib/flexTasks.jar" />
    2. FLEX_HOME 속성 추가 필수 속성이므로 반드시 정의 되어야 한다.
       <property name="FLEX_HOME" value="C:/flex/sdk"/>
    3. Ant 프로젝트 실행 방법
       ant -buildfile mySimpleBuild.xml

mxmlc 컴파일러 옵션

mxmlc Attributes 옵션
    1. file : Flex Appliation 파일명
    2. output : 컴파일된 Flex Application 파일명
    3. actionscript-file-encoding : Actionscript 인코딩 타입 지정
    4. incremental : 컴파일된 캐쉬파일 형태. 재 컴파일시 캐쉬파일을 체크하여 변경된 사항만 컴파일함
    5. keep-generated-actionscript : mxml을 actionscript로 자동 generated한 코드 생성여부
    6. services : FDS사용시 services-config.xml 경로

mxmlc 하위 옵션
    1. load-config : flex-config.xml 경로(디폴트는 SDK에 포함된 flex-config.xml을 사용한다.)
    2. default-size : 컴파일된 Flex Application의 사이즈(width,height)
       <default-size width="500" height="600" />
    3. runtime-shared-libraries : RSL 라이브러리 경로(RSL을 사용할 경우만)
       <runtime-shared-libraries url="FlexLibTask.swf"/>
    4. compiler.external-library-path : 링크 형태로 swc 라이브러리를 사용함. 패스에 폴더를 지정하여 폴더 내부의 여러 개의 swc파일을 사용할 경우 “append”속성을 “true”로 설정하여 사용한다. Flex Application에서 해당 라이브러리를 사용할경우 런타임 시에는 RSL로 생성된 swf파일이 있어야 한다.

 <compiler.external-library-path dir="${flexlibtask.project.home}" append="true">
    <include name="build/FlexLibTask1.swc" />
<include name="build/FlexLibTask2.swc" />
</compiler.external-library-path>
5. license : 라이선스 정보
       <license product="charting" serial-number="1234567890"/>
    6. compiler.library-path : Flex Application에 해당 라이브러리를 포함하여 컴파일 한다. 최종 컴파일된 Flex Application파일은 라이브러리 사이즈만큼 증가한다.
 <compiler.library-path dir="${FLEX_HOME}/frameworks" append="true">
    <include name="libs" />
    <include name="../bundles/{locale}" />
</compiler.library-path>

Mxmlc flex tasks 예제
Build.properties(taskbuild.xml 환경변수 설정)
//라이브러리프로젝트경로,Application 컴파일시 swc파일을참조하기때문에추가
flexlibtask.project.home=../FlexLibTask
//flexTasks.jar 경로
flexTasks.name=./flexTasks.jar
//flex sdk경로(필수)
FLEX_HOME=C:/flex_sdk_2

Taskbuild.xml
 <?xml version="1.0" ?>
<project name="FlexAppTask" default="run">
           <property file="build.properties" />
           <!-- 빌드된 파일들이 저장되는 폴더경로 -->
           <property name="build.home" value="./build" />
           <!-- 메인 Flex Application 파일 -->
           <property name="build.app" value="./src/FlexAppTask.mxml" />
           <!-- 컴파일된 Flex Application 파일 -->
           <property name="build.swf" value="${build.home}/FlexAppTask.swf" />
           <!-- flexTasks.tasks 정의 -->
           <taskdef resource="flexTasks.tasks" classpath="${flexTasks.name}" />
          
           <!-- 빌드 폴더 생성 -->
           <target name="init">
                     <tstamp />
                     <mkdir dir="${build.home}" />
           </target>
           <!-- 빌드 초기화 -->
           <target name="clean">
                     <delete dir="${build.home}" />
           </target>
           <!-- Flex Application 컴파일 -->
           <target name="compile" depends="clean,init">
                     <echo>Building ${build.swf}</echo>
        <mxmlc
            file="${build.app}"
            output="${build.swf}"
            actionscript-file-encoding="UTF-8"
            incremental="true"
        >
        <!-- RSL 라이브러리 사용. -->
            <runtime-shared-libraries url="FlexLibTask.swf"/>
         <!-- 링크형태로 FlexLibTask.swc를 사용. -->
        <compiler.external-library-path dir="${flexlibtask.project.home}" append="true">
                <include name="build/FlexLibTask.swc" />
            </compiler.external-library-path>
            <default-size width="500" height="600" />
        </mxmlc>
    </target>
           <target name="run" depends="compile">
           </target>
</project>
추가적인 옵션 설명은 아래 URL을 참고하기 바란다.
http://livedocs.adobe.com/flex/201/html/wwhelp/wwhimpl/common/html/wwhelp.htm?context=LiveDocs_Book_Parts&file=compilers_123_23.html

compc 컴파일러 옵션

compc Attributes 옵션
    1. output : 컴파일된 swc파일명
    2. include-classes : swc에 포함될 클래스 목록 정의
    3. locale : 리소스 로케일 설정
compc 하위 옵션
    1. source-path : 프로젝트 소스 폴더 경로
       <source-path path-element="${basedir}/components"/>
    2. include-file : swc에 포함될 리소스 파일들(gif,jpg,css,swf…)

<include-file name="f1-1.jpg" path="assets/images/f1-1.jpg"/>
<include-file name="f1-2.jpg" path="assets/images/f1-2.jpg"/>
<include-file name="f1-3.jpg" path="assets/images/f1-3.jpg"/>
<include-file name="f1-4.jpg" path="assets/images/f1-4.jpg"/>
<include-file name="main.css" path="assets/css/main.css"/>

    3. namespace : swc 클래스들을 참조할 때 사용하는 네임 스페이스 정의
       <namespace uri="${namespace.name}" manifest="${manifest.name}"/>
    4. license : 라이선스 정보
       <license product="charting" serial-number="1234567890"/>
    5. include-namespaces : 네임 스페이스 정의
       <include-namespaces uri="${namespace.name}"/>
    6. compiler.external-library-path : 컴파일시 필요한 링크 형태의 라이브러리 정보들
<compiler.external-library-path dir="." append="true">
<include name="build/Cairngorm2.swc" />
</compiler.external-library-path>

compc flextasks 예제
Build.properties(taskbuild.xml 환경변수 설정)
//flex sdk경로(필수)
FLEX_HOME=C:/flex_sdk_2
//flexTasks.jar 경로
flexTasks.name=./flexTasks.jar
manifest.name=libmanifest.xml
//네임스페이스이름
namespace.name=http://www.domain.co.kr/2006/mxml

Libmainfest.xml
swc에 포함될 클래스 목록을 정의한다. 반드시 이곳이 정의된 클래스들만 swc에 포함된다.
id값은 Unique가 보장되어야 한다.
 <?xml version="1.0" encoding="utf-8"?>
<componentPackage>
    <component id="sample.ButtonImage" class="sample.ButtonImage"/>
    <component id="sample.IconLabel" class="sample.IconLabel"/>
</componentPackage>

Taskbuild.xml
 <?xml version="1.0" ?>
<project name="FlexLibTask" default="extract">
           <property file="build.properties"/>
           <!-- flexTasks.tasks 정의 -->
           <taskdef resource="flexTasks.tasks" classpath="${flexTasks.name}" />
           <!-- 빌드된 파일들이 저장되는 폴더경로 -->
           <property name="build.home" value="./build" />
           <!-- 컴파일된 swc 파일 -->
           <property name="swc.file" value="${build.home}/FlexLibTask.swc" />
          
           <!-- 빌드 폴더 생성 -->
           <target name="init">
                     <tstamp />
                     <mkdir dir="${build.home}" />
           </target>
           <!-- 빌드 초기화 -->
           <target name="clean">
                     <delete dir="${build.home}" />
           </target>
           <!-- RSL파일 생성 -->
           <target name="extract" description="Extract SWC" depends="compile">
                     <unzip src="${swc.file}" dest="${build.home}"/>
                     <move file="${build.home}/library.swf" tofile="${build.home}/FlexLibTask.swf"/>
           </target>
           <!-- SWC 컴파일 -->
           <target name="compile" description="Compile FlexLibTask SWC." depends="clean,init">
                     <echo>Building ${swc.file}</echo>
                     <compc
           output="${swc.file}">
                                <source-path path-element="./src"/>
                                <namespace uri="${namespace.name}" manifest="${manifest.name}"/>
                                <include-namespaces uri="${namespace.name}"/>
                                <!-- 리소스 파일 목록 -->
                                <include-file name="images/icon1.gif" path="src/images/icon1.gif"/>
                                <include-file name="images/icon2.gif" path="src/images/icon2.gif"/>
                     </compc>
           </target>
</project>

추가적인 옵션 설명은 아래 URL을 참고하기 바란다.
http://livedocs.adobe.com/flex/201/html/wwhelp/wwhimpl/common/html/wwhelp.htm?context=LiveDocs_Book_Parts&file=compilers_123_23.html

Flex Ant Task로 프로젝트를 빌드하자

샘플 SWC 프로젝트 생성
Flex Builder에서 Flex Library Project를 생성한다. 빌드관련 파일들은 루트폴더에 정의하고 소스코드는 src폴더를 생성하여 src아래에 추가한다. 완성된 코드는 첨부파일을 참고한다.
첨부파일은 필자의 블로그에서 다운받을 수 있다.
[그림4]

Ant 빌드하기
Flex Builder에 Ant가 설치된 경우 뷰에 빌드파일을 추가한후 “FlexLibTask”를 클릭하면 빌드된다.
[그림5]

빌드시 콘솔 로그
[그림6]

커맨드 창을 이용할 경우
커맨트 창을 열어서 해당 프로젝트 폴더로 이동한후 ant를 실행한다.
[그림7]


샘플 Flex Application 프로젝트 생성
Flex Builder에서 Flex Project를 생성한다. 빌드관련 파일들은 루트폴더에 정의하고 소스코드는 src폴더를 생성하여 src아래에 추가한다. 완성된 코드는 첨부파일을 참고한다.
첨부파일은 필자의 블로그에서 다운받을 수 있다.
[그림8]

Ant 빌드하기
Flex Builder에 Ant가 설치된 경우 뷰에 빌드파일을 추가한후 “FlexAppTask”를 클릭하면 빌드된다.
[그림9]

빌드시 콘솔 로그
[그림10]

커맨드 창을 이용할 경우
커맨트 창을 열어서 해당 프로젝트 폴더로 이동한후 ant를 실행한다.
[그림11]


Flex Application 실행하기
RSL라이브러리를 사용하기 때문에 FlexAppTask.swf와 FlexLibTask.swf는 동일한 폴더에 존재해야만 FlexAppTask.swf를 실행 할 수 있다.
빌더에서 테스트를 한다면 FlexLibTask.swf를 FlexAppTask프로젝트의 build폴더에 복사한후 Application을 클릭하여 실행한다.
[그림12]

실행화면
[그림13]
 
top

Trackback Address :: http://www.ssial.com/trackback/235 관련글 쓰기

  1. Nike shox 2012/02/09 12:02 댓글주소 | 수정/삭제 | 댓글

    This was very informative. I have been reading your blog a lot over the past few days and it has earned a place in my bookmarks.
    http://www.buynikeshox2012.com/

Write a comment


◀ PREV : [1] : ... [56] : [57] : [58] : [59] : [60] : [61] : [62] : [63] : [64] : ... [206] : NEXT ▶