우리는 어디에 있었나요? 처음 두 가지 문제에 대해 너무 많이 생각하느라 피곤하셨나요? 걱정하지 마세요. 이번 호의 주제는 매우 쉽습니다. 일부 구문을 간략하게 이해하고 구성 몇 줄만 작성하면 미리 설정된 방법에 따라 일부 작업을 자동으로 완료하도록 시스템을 구동할 수 있습니다. 기분 좋은 것 같지 않나요? 출발하자!
이번 호에서는 Ant를 사용하여 이전 호에서 작성하고 정리한 코드 파일을 지정된 순서대로 하나의 소스 파일로 병합한 후 이 파일을 압축해 보겠습니다. JavaScript 프로젝트를 빌드하기 위한 기본 단계는 다음과 같습니다. Ant는 Apache의 상위 오픈 소스 프로젝트로 인터넷에 Ant의 소개 및 설치에 대한 기사가 많이 있으므로 여기서는 자세히 설명하지 않겠습니다. 빌드하기 전에 기존 파일 레이아웃을 살펴보겠습니다.
smart-queue // 구성 요소의 루트 디렉터리
+--- src // 자바스크립트 소스 파일 디렉터리
+--- lang.js // 위에서 언급한 "외부 파일"
+--- smart-queue.js // 스마트 큐 메인 파일
이제 우리는 그것을 "full"로 만들고 싶습니다:
참새는 작지만 모든 내장을 가지고 있습니다. 이제 Smart Queue는 더욱 전문적인 JavaScript 프로젝트처럼 보입니다.
smart-queue // 구성 요소의 루트 디렉터리
+--- lib // JavaScript 외부 프로그램 및 라이브러리 파일 디렉터리
+--- yuicompressor.jar // YUI 압축기
+--- test //파일 디렉터리 테스트
+--- src // 자바스크립트 소스 파일 디렉터리
+--- intro.js // 소개 및 버전 정보
+--- lang.js // 위에서 언급한 "외부 파일"
+--- smart-queue.js // 스마트 큐 메인 파일
+--- README // 컴포넌트 readme 파일
+--- LICENSE // 컴포넌트 인증 정보
우리는 컴포넌트 루트 디렉터리 아래의 build 하위 디렉터리에 빌드된 파일을 저장하고, 빌드 도구를 통해 이를 생성하고 제거할 계획입니다. 처음으로 빌드를 시도하기 전에 Ant의 구성 파일인 build.xml의 구조에 대한 일반적인 이해를 갖는 것이 좋습니다.
<프로젝트 이름="내 프로젝트" default="dist" basedir=".">
<설명>
간단한 예제 빌드 파일
</설명>
<!-- 이 빌드에 대한 전역 속성 설정 -->
<속성 이름="src" 위치="src"/>
<속성 이름="빌드" 위치="빌드"/>
<속성 이름="dist" 위치="dist"/>
<대상 이름="초기화">
<!-- 타임스탬프 생성 -->
<t스탬프/>
<!-- 컴파일에 사용되는 빌드 디렉터리 구조 생성 -->
<mkdir dir="${build}"/>
</target>
<대상 이름="컴파일" 종속="초기화"
설명="소스 컴파일" >
<!-- ${src}의 Java 코드를 ${build}로 컴파일합니다 -->
<javac srcdir="${src}" destdir="${build}"/>
</target>
<대상 이름="clean"
설명="정리" >
<!-- ${build} 및 ${dist} 디렉토리 트리 삭제 -->
<delete dir="${build}"/>
<삭제 dir="${dist}"/>
</target>
</프로젝트>
이해하기 쉬운 이름과 설명 외에도 볼 수 있는 다른 패턴은 다음과 같습니다.
출처: 알리페이 UED