一分鐘開始持續集成之旅系列之：Java + GWT

做者：CODING - 朱增輝

前言

Google Web Toolkit（GWT）是一個開源、免費的 Web 開發框架，經過該框架，您可使用 Java 構建複雜、高性能的 JavaScript 應用程序。

持續集成指的是，頻繁地（一天屢次）將代碼集成到主幹。它的好處主要有兩個：（1）快速發現錯誤。（2）防止分支大幅偏離主幹。持續集成的目的，就是讓產品能夠快速迭代，同時還能保持高質量。 —— 阮一峯

本文的示例會建立一個簡單的 GWT 應用，並利用 CODING 平臺持續集成能力實現自動構建、測試和發佈。

準備環境

安裝必要的工具，包括 Java、Maven 和 GWT SDK等。這裏以 MacOS 爲例說明，其餘系統請自行搜索。

安裝 JDK

GWT 要求 JDK 1.6 或以上版本，在 console 中執行命令 java -version 檢查是否已安裝，輸出以下圖相似內容，即表示已安裝。

若是沒有安裝，可經過 Homebrew 工具安裝，命令以下

brew tap adoptopenjdk/openjdk
brew cask install adoptopenjdk8

其餘平臺請按照官方指導安裝。

安裝 Maven

經過命令 mvn -v 檢查 Maven 版本，輸出相似下圖即表示已安裝

若是沒有安裝，可經過 Homebrew 工具安裝，命令以下

brew instll maven

其餘平臺請按照官方指導安裝

安裝 GWT SDK

能夠經過 Homebrew 工具或者下載 GWT SDK 壓縮包安裝。寫做本文時，GWT 最新穩定版本是 2.8.2。

（1）Homebrew 安裝

brew install gwt

默認安裝路徑爲

（2）下載壓縮包安裝
爲方便你們下載，已將官網 GWT SDK 2.8.2 版本壓縮包上傳到 CODING 製品庫，可經過以下方式下載

curl -L "https://coding-public-generic.pkg.coding.net/demo-gwt/generic/gwt.zip?version=2.8.2" -o gwt-2.8.2.zip

下載後的壓縮包解壓到任意目錄（如 /home/user/gwt-2.8.2），並配置到 PATH 環境變量，以下所示

PATH=$PATH:/home/user/gwt-2.8.2/
export PATH

以上任一方式安裝後，可執行以下命令測試是否安裝成功

webAppCreator

輸出以下

Intellij IDEA 開啓 GWT 支持

IDEA 默認支持建立 GWT 應用，本文使用命令行工具建立項目，不依賴具體 IDE，經過 IDE 建立 GWT 應用的方式可參見 Intellij IDEA 相關介紹。

步驟一 建立 GWT 應用

使用命令行工具建立 GWT Maven 項目

webAppCreator -out hello -templates maven,sample,readme com.demo.gwt.HelloWorld

在 IDEA 中打開上面建立的項目，依次點擊：

File --> Open --> hello（項目名）

打開後能夠看到項目目錄結構：

步驟二 運行 GWT 應用

GWT 項目文件主要由四部分組成（見下表），能夠根據本身的須要修改，爲避免增長複雜度，這裏不作修改。

內容	說明	位置
模塊描述符	用於配置 GWT 應用，XML 格式	src/main/java/com/demo/gwt/HelloWorld.gwt.xml
公共資源	GWT 模塊引用的文件，如 HTML 頁面、CSS 樣式或圖像	src/main/webapp
客戶端代碼	實現應用程序業務邏輯的 Java 代碼，GWT 編譯器將其轉換爲 JavaScript，最終在瀏覽器中運行	src/main/java/com/demo/gwt/client
服務端代碼	可選的，若是應用不須要服務端處理，不用提供	src/main/java/com/demo/gwt/server

在 IDEA 菜單欄中選擇編輯配置，打開運行配置彈窗，添加 GWT 配置。修改配置名，選擇 HelloWorld 模塊，而後點擊 OK 保存配置並退出彈窗。

選擇上面建立的 GWT 運行配置，單擊運行，IDEA 會自動打開瀏覽器，運行應用。

步驟三 利用持續集成進行自動構建、測試、發佈

（1）本地初始化 git 倉庫
在項目根目錄執行 git 初始化命令

git init

（2）準備 CODING 項目
在 CODING 平臺建立項目，選擇 DevOps 模板。

在填寫項目基本信息頁面，爲了使用本地 git 倉庫，這裏不勾選 啓用 README.md 文件初始化項目。

上面建立的 CODING 項目沒有初始化代碼倉庫，能夠按照指引按照本身的須要進行初始化，這裏選擇使用命令行推送已存在的倉庫。

根據指引將本地代碼倉庫推送到 CODING 平臺。

在 構建 頁面建立新的構建計劃，爲方便管理構建計劃，這裏選擇使用代碼倉庫中的 Jenkinsfile。

點擊使用模板，可根據本身須要選擇合適模板，這裏選擇 簡易模板。

保存構建計劃後，系統會自動將構建模板對應的 Jenkinsfile 推送到倉庫，默認爲 master 分支。
本地執行 git pull 命令拉取代碼，修改 Jenkinsfile 文件。咱們但願平臺能夠自動構建、測試，最後發佈到製品庫，修改後的內容以下所示

def ARTIFACT_ID = ""
def VERSION = ""
pipeline {
  agent any

  stages {
    stage('檢出') {
      steps {
        checkout([
          $class: 'GitSCM', branches: [[name: env.GIT_BUILD_REF]],
          userRemoteConfigs: [[
            url: env.GIT_REPO_URL,
            credentialsId: env.CREDENTIALS_ID
          ]]
        ])

        script {
            def pom = readMavenPom()
            ARTIFACT_ID = pom.getArtifactId()
            VERSION = pom.getVersion()
        }
      }
    }

    stage('構建') {
      steps {
        sh 'mvn package'

        archiveArtifacts(artifacts: "target/${ARTIFACT_ID}-${VERSION}.war", fingerprint: true)
      }
    }

    stage('測試') {
      steps {
        sh 'mvn gwt:test'
      }
    }

    stage('發佈到 generic 製品庫') {
      steps {
        codingArtifactsGeneric(
            files: "${ARTIFACT_ID}-${VERSION}.war",
            repoName: "${env.GENERIC_REPO_NAME}",
            version: "${VERSION}",
            workspace: "/root/workspace/target"
        )
      }
    }
  }
}

修改後提交併推送到遠程倉庫，在 構建 頁面點擊 當即構建 按鈕便可觸發構建，也可按須要配置自動構建觸發規則，詳情見 CODING 幫助文檔。構建完成後會收到通知，能夠點開構建詳情查看詳細日誌。

打開 製品庫 頁面能夠看到自動發佈的文件。

總結

在本次教程中，咱們建立了簡單的 GWT 應用，熟悉了 GWT 項目結構及其命令行工具的使用，而且藉助 CODING 平臺提供的持續集成能力實現了應用的自動構建、測試和發佈。CODING 提供的持續集成能力遠比教程中展現的要強大，有興趣的同窗能夠閱讀官方文檔詳細瞭解，相信能夠爲您的工做提供幫助，創造更好的效益。

示例代碼能夠在 CODING 公開源代碼倉庫 獲取。