持續集成工具的使用

什麼是持續集成

持續集成(Continuous integration,簡稱CI)是指頻繁地將代碼集成到主幹。前端

持續集成的好處能夠幫助咱們快速發現錯誤,集成到主幹前須要通過自動測試,若是過程當中出現錯誤,將沒法完成這次集成,這是其一。vue

第二點好處是能夠防止分支與主幹的誤差過大,致使集成難度變大。假如在分支發開時,沒有及時集成到主幹,而主幹又在不斷更新,將會致使分支與主幹的誤差過大,最終致使難以集成。node

使用持續集成工具還可以替咱們完成繁瑣的工做,例如自動部署等。git

持續集成的工具很是多,例如 Travis CIJenkinsGitlab CI 等等。本文將簡單介紹一下 Travis CI 的使用。github

應用

Travis 是一款流行的 CI 工具,可免費用於開源項目。在託管時,沒必要依賴任何平臺。Travis CI 工具爲許多構建配置和語言提供支持。shell

前段時間寫了個 Python 的項目,纔開始瞭解到了 Travis CI。在項目的根目錄添加了 .travis.yml 文件進行配置,當代碼發生變更時,Travis CI 將會執行測試腳本,經過測試後將代碼打包成 Docker 鏡像並推送到官方倉庫。npm

這兩天我用 VuePress 搭建了一個新的博客站點 blog.fedevelop.cn,恰好利用 Travis CI 實現部署的工做,省下了寶貴的時間。json

例子

下面我將自動部署博客的應用做爲例子,帶你們熟悉持續集成工具。bash

首先在個人 VuePress 項目裏添加 .travis.yml 文件。個人內容只有簡單 3 行,以下工具

# 指定語言
language: node

# 安裝依賴
install: npm install

# 執行腳本
script: npm run deploy
複製代碼

deploy 命令是我在 package.json 中定義好的一個命令,內容以下

"script": {
    "dev": "xxx",
    "build": "xxx",
    "deploy": "bash deploy.sh"
}
複製代碼

bash deploy.sh 意思是執行 deploy 這個 shell 腳本, deploy.sh 的內容以下

#!/usr/bin/env sh 
# 確保腳本拋出遇到的錯誤
set -e

# 生成靜態文件
npm run build

# 進入生成靜態文件的文件夾
cd blogs/.vuepress/dist

git init
git add .
git commit -m "auto push"
git remote add origin https://${token}@github.com/<your name>/<your name>.github.io.git
git push -f --set-upstream origin master

cd -
複製代碼

意思爲先執行 npm run build 命令進行編譯,若是報錯的話,Travis 將不會進行下面的操做。若是編譯沒有報錯的話,將會進入 blogs/.vuepress/dist 目錄,將裏面的內容推送到個人 GitHub Page 項目,完成部署工做。

其中 ${token} 將會獲取 Travis 中設置的環境變量。涉及隱私的數據,咱們能夠經過環境變量的方式來傳遞。下面咱們就來看如何設置。

下一步打開 Travis 官網 travis-ci.org 能夠看到右上角的 Sign in with GitHub 即用 GitHub 帳號登陸。

Travis 官網

完成登陸後,進入設置頁,能夠看到本人的 GitHub 的項目,找到 VuePress 的項目。若是項目過多,找不到項目,能夠點擊 Sync account 按鈕同步帳戶。接下里進入設置頁,這裏咱們能夠設置監聽的分支、環境變量等。

設置頁

其中 Environment Variables 爲環境變量,Cron Jobs 爲定時任務。在 .travis.yml 中可使用 ${key} 取得環境變量中的值。

由於從 Travis 提交代碼到 GitHub 默認是會被拒絕的,咱們須要加上 access_token,個人項目裏設爲了 token。

接下來就能夠去 GitHub github.com/settings/to… 獲取 access_token,點擊 Generate new token 按鈕,將生成好的 access_token 複製到 Travis 的環境變量中。到這裏就算配置完成。

接下來只要個人提交代碼,Travis 就會幫我構建部署,這樣我就省去了許多部署的時間。

關於 .travis.yml 的配置還有不少,若是感興趣也能夠到 Travis 官網查看文檔。


若是你喜歡個人文章,但願能夠關注一下個人公衆號【前端develop】

前端develop
相關文章
相關標籤/搜索