中文字幕二区_国产精品免费在线观看_黄色网站观看_人人草人人澡_日本真实娇小xxxx

目錄：

1. JavaScript組件之旅:分析和設(shè)計(jì) 
2. JavaScript組件之旅:編碼實(shí)現(xiàn)和算法
3. JavaScript組件之旅:用Ant構(gòu)建組件
4. JavaScript組件之旅:測(cè)試組件

我們走到哪兒了？前兩期思考了太多東西，你是否已有倦意？別擔(dān)心，本期的話題很輕松，你只需要簡(jiǎn)單了解一些語(yǔ)法，寫幾行配置，就能驅(qū)使系統(tǒng)按你預(yù)設(shè)的方式自動(dòng)完成一些工作。聽起來是不是很愜意？Let’s go! 我們出發(fā)啦～

這期，我們會(huì)使用 Ant 將上期編寫、整理的代碼文件按指定的先后順序合并成單一的源文件，然后壓縮這個(gè)文件。這是構(gòu)建 JavaScript 項(xiàng)目的基本步驟。Ant 是 Apache 的一個(gè)頂級(jí)開源項(xiàng)目，網(wǎng)上對(duì)它的介紹和安裝，已經(jīng)有很多文章，這里就不再贅述了。在構(gòu)建之前，我們先來看看已有的文件布局：

  smart-queue  // 組件的根目錄
    +--- src  // JavaScript源文件目錄
        +--- lang.js  // 前文提到的“外部文件”
        +--- smart-queue.js  // Smart Queue 主文件

現(xiàn)在，我們要讓它“豐滿”起來：

• 組件根目錄下添加：
  • README: 介紹 Smart Queue 組件
  • LICENSE: 組件的授權(quán)信息
  • build.xml: Ant 使用的配置文件
• 組件根目錄下添加 lib 子目錄：存放構(gòu)建過程中需要使用的外部程序和庫(kù)文件
  • lib 子目錄下添加 yuicompressor.jar: 我們用 YUI Compressor 壓縮 JavaScript
• 組件根目錄下添加 test 子目錄：存放測(cè)試組件所需的文件（下期介紹）
• src 目錄下添加 intro.js: 介紹組件的版本及說明信息

麻雀雖小，五臟俱全�，F(xiàn)在 Smart Queue 看上去像是比較專業(yè)的 JavaScript 項(xiàng)目了：

  smart-queue  // 組件的根目錄
    +--- lib // JavaScript外部程序和庫(kù)文件目錄
        +--- yuicompressor.jar  // YUI Compressor
    +--- test // 測(cè)試文件目錄
    +--- src // JavaScript源文件目錄
        +--- intro.js  // 介紹和版本信息
        +--- lang.js  // 前文提到的“外部文件”
        +--- smart-queue.js  // Smart Queue 主文件
    +--- README // 組件自述文件
    +--- LICENSE // 組件授權(quán)信息

我們計(jì)劃將構(gòu)建出來的文件存放到組件根目錄下的 build 子目錄，還要通過構(gòu)建工具創(chuàng)建并銷毀它。首次嘗試構(gòu)建前，建議先大概了解一下 Ant 的配置文件——build.xml 的結(jié)構(gòu)：

<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>

仔細(xì)觀察一下，除了 name, description 這些名字都很容易理解外，其他可以看到的規(guī)律包括：

• project 元素的 default 屬性值對(duì)應(yīng)某個(gè) target 元素的 name 屬性；
• target 元素的 depends 屬性值對(duì)應(yīng)其他某些 target 元素的 name 屬性；
• ${somename} 可以引用 property 中定義的值。

出處：Alipay UED
責(zé)任編輯：bluehearts

上一頁(yè) 下一頁(yè) JavaScript組件之旅:用Ant構(gòu)建組件 [2]

◎進(jìn)入論壇網(wǎng)頁(yè)制作、WEB標(biāo)準(zhǔn)化版塊參加討論，我還想發(fā)表評(píng)論。