基於 GitLab CI 搭建前端自動構建環境

時間小魚發表於2018-07-12

什麼是持續整合 ?

持續整合(Continuous integration,簡稱CI)指的是,頻繁地(一天多次)將程式碼整合到主幹。

GitLab CI

什麼是 GitLab CI ?

GitLab CIGitLab Continuous Integration (Gitlab 持續整合)的簡稱。從 GitLab 的 8.0 版本開始,GitLab 就全面整合了 Gitlab-CI,並且對所有專案預設開啟。只要在專案倉庫的根目錄新增 .gitlab-ci.yml 檔案,並且配置了 Runner (執行器),那麼每一次合併請求(MR)或者 push 都會觸發 CI pipeline

如果一切執行正常,你將得到與 commit 關聯的標記。如圖:

基於 GitLab CI 搭建前端自動構建環境

什麼是 Pipeline ?

一次 Pipeline 其實相當於一次構建任務,裡面可以包含多個流程,如安裝依賴、執行測試、編譯、部署測試伺服器、部署生產伺服器等流程。 任何提交或者 Merge Request 的合併都可以觸發 Pipeline,如下圖所示:


+------------------+           +----------------+
|                  |  trigger  |                |
|   Commit / MR    +---------->+    Pipeline    |
|                  |           |                |
+------------------+           +----------------+

複製程式碼

什麼是 Stages ?

Stages 表示構建階段,說白了就是上面提到的流程。 我們可以在一次 Pipeline 中定義多個 Stages,這些 Stages 會有以下特點:

  • 所有 Stages 會按照順序執行,即當一個 Stage 完成後,下一個 Stage 才會開始
  • 只有當所有 Stages 完成後,該構建任務 (Pipeline) 才會成功
  • 如果任何一個 Stage 失敗,那麼後面的 Stages 不會執行,該構建任務 (Pipeline) 失敗

因此,StagesPipeline 的關係就是:

+--------------------------------------------------------+
|                                                        |
|  Pipeline                                              |
|                                                        |
|  +-----------+     +------------+      +------------+  |
|  |  Stage 1  |---->|   Stage 2  |----->|   Stage 3  |  |
|  +-----------+     +------------+      +------------+  |
|                                                        |
+--------------------------------------------------------+
複製程式碼

什麼是 Jobs ?

Jobs 表示構建工作,表示某個 Stage 裡面執行的工作。 我們可以在 Stages 裡面定義多個 Jobs,這些 Jobs 會有以下特點:

  • 相同 Stage 中的 Jobs 會並行執行
  • 相同 Stage 中的 Jobs 都執行成功時,該 Stage 才會成功
  • 如果任何一個 Job 失敗,那麼該 Stage 失敗,即該構建任務 (Pipeline) 失敗

所以,JobsStage 的關係圖就是:


+------------------------------------------+
|                                          |
|  Stage 1                                 |
|                                          |
|  +---------+  +---------+  +---------+   |
|  |  Job 1  |  |  Job 2  |  |  Job 3  |   |
|  +---------+  +---------+  +---------+   |
|                                          |
+------------------------------------------+

複製程式碼

安裝配置

安裝環境為 Ubuntu 16.04.4 LTS (GNU/Linux 4.4.0-105-generic x86_64)docker 版本為 Docker version 18.03.1-ce, build 9ee9f40

  • 安裝 gitlab-ci-multi-runner

# For Debian/Ubuntu
curl -L https://packages.gitlab.com/install/repositories/runner/gitlab-ci-multi-runner/script.deb.sh | sudo bash

# For RHEL/CentOS
curl -L https://packages.gitlab.com/install/repositories/runner/gitlab-ci-multi-runner/script.rpm.sh | sudo bash

複製程式碼
  • 檢視 docker images

sudo docker images

複製程式碼

如何使用 GitLab CI ?

  • 在專案根目錄建立 .gitlab-ci.yml 檔案,檔案程式碼如下:

stages 定義 Stages,預設有三個 Stages,分別是 buildtestdeployJob.only 定義只有 develop 分支會觸發相關的 Jobs


stages:
    - build
job1:
    # 是否開啟 debug 模式
    # variables:
    #     CI_DEBUG_TRACE: "true"
    stage: build
    tags:
        - 新建 runner 的標籤
    only:
        - develop
    script:
        - cd public
        - npm i
        - npm run build

複製程式碼
  • 進入 pipeline 配置頁面

基於 GitLab CI 搭建前端自動構建環境

  • 記下 URLToken,留以註冊 runner 使用

註冊 runner

  • 註冊 runner,runner 註冊成功之後,你會在 pipeline 配置頁面看見 specific runners 下多出了你剛新增的 runner

sudo gitlab-ci-multi-runner register

# Please enter the gitlab-ci coordinator URL (e.g. https://gitlab.com )

你的 URL

# Please enter the gitlab-ci token for this runner

你的 Token

# Please enter the gitlab-ci description for this runner

my-runner

# Please enter the gitlab-ci tags for this runner (comma separated)

my-runner

Whether to run untagged builds [true/false]:

false

Whether to lock Runner to current project [true/false]:

false

# Please enter the executor: shell, docker, docker-ssh, ssh?

docker

# Please enter the Docker image (eg. ruby:2.1):

node:9.4.0

複製程式碼
  • 解除安裝 runner

sudo gitlab-ci-multi-runner unregister --url url地址 --token tocken值

複製程式碼
  • 檢視 runner 狀態

sudo gitlab-ci-multi-runner status

複製程式碼
  • 檢視 runner 列表

sudo gitlab-ci-multi-runner list

複製程式碼
  • 檢視 runner 配置檔案

sudo vim /etc/gitlab-runner/config.toml

複製程式碼

大功告成

切換到專案 Pipelines 頁面,發現出現以下情況,則代表你的 runner 已經配置完成,你的每一次提交都會觸發 runner

基於 GitLab CI 搭建前端自動構建環境

備註

  • 使用 GitLab CI 克隆私有倉庫時候,會提示 Host key verification failed

    需要做如下配置,Key 寫入 SSH_PRIVATE_KEYValue 寫入 伺服器 private SSH key。然後在 .gitlab-ci.yml 檔案前面寫入如下程式碼,並儲存。

基於 GitLab CI 搭建前端自動構建環境

```powershell

before_script:
    - 'which ssh-agent || ( apt-get update -y && apt-get install openssh-client -y )'
    # Run ssh-agent (inside the build environment)
    - eval $(ssh-agent -s)
    # Add the SSH key stored in SSH_PRIVATE_KEY variable to the agent store
    - ssh-add <(echo "$SSH_PRIVATE_KEY")
    - mkdir -p ~/.ssh
    - '[[ -f /.dockerenv ]] && echo -e "Host *\n\tStrictHostKeyChecking no\n\n" > ~/.ssh/config'

```
複製程式碼

參考連結

Getting GitLab CI to clone private repositories

用 GitLab CI 進行持續整合

相關文章