JavaScriptコンポーネントの旅(三):Antでコンポーネントを構築する

気持ちいいですか?Let's go出発します
今回はAntを使って前回作成、整理したコードファイルを指定された順序で単一のソースファイルに統合して圧縮します.これはJavaScriptプロジェクトを構築する基本的なステップです.AntはApacheのトップクラスのオープンソースプロジェクトで、ネット上でその紹介とインストールに対して、多くの文章があります.ここではもう詳しく説明しません.構築する前に、既存のファイルレイアウトを確認します.

 smart-queue //       
  +--- src // JavaScript     
    +--- lang.js //      “    ”
    +--- smart-queue.js // Smart Queue    

今、私たちはそれを「ふくよか」にします.

コンポーネントのルートディレクトリに追加します.

README:Smart Queコンポーネントを紹介する

LICENSE:コンポーネントのライセンス情報

build.xml:Antが使用するプロファイル

コンポーネントのルートディレクトリにlibサブディレクトリを追加します.構築中に必要な外部プログラムとライブラリファイルを保存します.

libサブディレクトリにyuicompressor.jarを追加します.私たちはYUI CopresterでJavaScriptを圧縮します.

コンポーネントのルートディレクトリにtestサブディレクトリを追加します.テストコンポーネントを格納するために必要なファイル(次号紹介)

srcディレクトリにintro.jsを追加します.コンポーネントのバージョンと説明情報

を紹介します.
スズメは小さいが,五臓がそろっている.今はSmart QueはプロのJavaScriptプロジェクトのように見えます.

 smart-queue //       
  +--- lib // JavaScript          
    +--- yuicompressor.jar // YUI Compressor
  +--- test //       
  +--- src // JavaScript     
    +--- intro.js //        
    +--- lang.js //      “    ”
    +--- smart-queue.js // Smart Queue    
  +--- README //       
  +--- LICENSE //       

私たちは構築したファイルをコンポーネントのルートディレクトリの下に保管し、ツールを構築して作成して廃棄する計画です.初めて試みて構築する前に、Antのプロファイル――build.xmlの構造を大体理解することを提案します.

<project name="MyProject" default="dist" basedir=".">
  <description>
    simple example build file
  description>
 -- set global properties for this build -->
 <property name="src" location="src"/>
 <property name="build" location="build"/>
 <property name="dist" location="dist"/>

 <target name="init">
  -- Create the time stamp -->
  <tstamp/>
  -- Create the build directory structure used by compile -->
  <mkdir dir="${build}"/>
 target>

 <target name="compile" depends="init"
    description="compile the source " >
  -- Compile the java code from ${src} into ${build} -->
  <javac srcdir="${src}" destdir="${build}"/>
 target>

 <target name="clean"
    description="clean up" >
  -- Delete the ${build} and ${dist} directory trees -->
  <delete dir="${build}"/>
  <delete dir="${dist}"/>
 target>
project>

よく観察してみると、name, descriptionという名前以外は分かりやすいです.

project要素のdefault属性値は、あるtarget要素のname属性に対応している.

target要素のdepends属性値は、他のいくつかのtarget要素のname属性に対応している.

${somename}は、propertyに定義された値を参照することができる.

私達は自分のbuild.xmlを書き始めます.
まず、設定項目の基本情報と関連ディレクトリ名、使用するコードなどがあります.

<project name="Smart Queue" default="compress" basedir=".">
  <description>Build file for Antdescription>
  <property name="src" location="src" />
  <property name="build" location="build" />
  <property name="lib" location="lib"/>
  <property name="inputencoding" value="utf-8"/>
  <property name="outputencoding" value="gbk"/>

次に、初期化のためのtargetを定義し、buildサブディレクトリの作成を担当する.

  <target name="init">
    <mkdir dir="${build}"/>
  target>

次にconcatというtargetと定義し、Src内の3つのJavaScriptファイルを先着順に接続する.それを実行するには、先に定義されたinitを実行します.

  <target name="concat" depends="init">
    <concat destfile="${build}/smart-queue.source.js" encoding="${inputencoding}" outputencoding="${outputencoding}">
      <filelist dir="${src}" files="intro.js, lang.js, smart-queue.js" />
    concat>
  target>

このようにして、JavaScriptファイルを得ることができ、以下のtargetはこのファイルを圧縮する責任があり、明らかにconcatに依存し、initにも依存しているが、initに対する明示的な指定の依存性――Antはこの依存関係を処理することができる.ここでYUI Commprestorを呼び出し、適切なパラメータを入力します.

  <target name="compress" depends="concat">
    <java jar="${lib}/yuicompressor.jar" fork="true">
      <arg line="--type js --charset utf-8 -o ${build}/smart-queue.js ${build}/smart-queue.js"/>
    java>
  target>

大成功を収め、compress処理後の文書を生産システムに配置することができます.最後に整理作業をして、ファイルを作成してから最初の状態に戻すことができます.

  <target name="clean">
    <delete dir="${build}"/>
  target>

これで基本的な配置が終わったと言えます.それはどう使いますか?コマンドラインでコンポーネントのルートディレクトリ(またはbuild.xmlのディレクトリ)に入り、次のようにします.

はant concatを運転して、得られます./build/smart-queue.source.js

はantを実行しています.のdefaultに引用されたtarget、つまりcompressを選択します.だから、得られます./buildのsmart-queue.source.jsとsmart-queue.js

.

はant cleanを実行し、削除します./buildディレクトリは、最初の状態

に戻ります.
これらの前提はJDKとAntが正しくインストールされています.エラーが発生したら、それらが準備されているかどうかを確認する必要があります.
今回紹介したものは簡単だと思いますか?それはもちろんです.構築ツールは簡単に使いやすいべきです.でないと、大量の時間をそこに費やしてもいいですか?工具の価値は生産力を向上させ、より多くの価値を創造することにある.
最後に、ここでAntのヘルプ文書(面白いものがたくさんありますよ)を確認してもいいです.また、ここで今回の完全なbuild.xmlファイルを確認してもいいです.