前言
本文将介紹使用gitlab+gitlab-runner實作前端自動化部署的基本步驟:
- gitlab開啟自動化
- 使用docker-compose 安裝gitlab-runner
- 注冊gitlab-runner到 gitlab中
- 編輯.gitlab-ci.yml
- 編輯環境變量
gitlab開啟自動化
進入項目=>設定=>CI/CD=>自動化=>自動部署到預釋出環境,手動部署到生産環境=>儲存更改
![](https://img.laitimes.com/img/__Qf2AjLwojIjJCLyojI0JCLiAzNfRHLGZkRGZkRfJ3bs92YsYTMfVmepNHL4FlaOpXRE1UeNpHW4Z0MMBjVtJWd0ckW65UbM5WOHJWa5kHT20ESjBjUIF2X0hXZ0xCMx81dvRWYoNHLrdEZwZ1Rh5WNXp1bwNjW1ZUba9VZwlHdssmch1mclRXY39CXldWYtlWPzNXZj9mcw1ycz9WL49zZuBnL0EjM0EDMzETM2IjMxkTMwIzLc52YucWbp5GZzNmLn9Gbi1yZtl2Lc9CX6MHc0RHaiojIsJye.png)
檢視runners
使用docker-compose 安裝gitlab-runner
vi docker-compose.yml
增加配置内容
version: '3'
services:
runner:
image: 'gitlab/gitlab-runner:v12.4.0'
container_name: gitlab-runner
privileged: true
restart: always
volumes:
- ./config:/etc/gitlab-runner
- /var/run/docker.sock:/var/run/docker.sock
運作gitlab-runner
docker-compose up -d
注冊gitlab-runner到 gitlab中
執行指令
docker exec -it gitlab-runner gitlab-runner register
Please enter the gitlab-ci coordinator URL (e.g. https://gitlab.com )
#輸入你的gitlab位址,需檢查容器間後容器的網絡互通性
Please enter the gitlab-ci token for this runner
#gitlab的token(在gitlab的Admin Area中) 或者倉庫的token(倉庫->設定->Runner)
Please enter the gitlab-ci description for this runner
# 描述資訊
Please enter the gitlab-ci tags for this runner (comma separated):
#可以為空,後續修改
Please enter the executor: parallels, shell, ssh, virtualbox, docker+machine, docker-ssh+machine, docker, docker-ssh, kubernetes:
#選擇執行器,非常重要的步驟,這裡選擇docker(這樣就是docker in docker 了)
Please enter the Docker image (eg. ruby:2.1):
#docker:stable
Runner registered successfully. Feel free to start it, but if it's running already the config should be automatically reloaded!
注冊成功後如下圖所示:
編輯.gitlab-ci.yml
自動化部署有以下幾個步驟
- 0.配置ssh免密碼登陸
- 1.下載下傳node鏡像
- 2.npm install 項目依賴
- 3.npm run build 打包項目
- 4.rsync 同步到服務端
- 5.執行站點更新腳本
image: node:6.9.0
cache:
key: ${CI_BUILD_REF_NAME}
paths:
- node_modules/ #緩存node_modules
stages:
- build
#- test
- deploy
master-build:
stage: build
script:
- dir
#- npm config set registry https://registry.npm.taobao.org
- npm install
- npm run build
- dir
only:
- master
artifacts:
expire_in: 1 week
paths:
- dist #提供可下載下傳
master-deploy:
stage: deploy
script:
- mkdir -p ~/.ssh
- echo "$TEST100_DEPLOY_SSH" >> ~/.ssh/id_rsa
- chmod 600 ~/.ssh/id_rsa
#- echo -e "Host *\n\tStrictHostKeyChecking no\n\n" > ~/.ssh/config
- rsync -rav --delete dist/ "$TEST100_DEPLOY_USER"@"$TEST100_DEPLOY_HOST:"$TEST100_DEPLOY_PATH"
- sh $TEST100_UPDATE_SHELL
only:
- master
編輯環境變量
進入項目=>設定=>CI/CD=>變量=>新增所需環境變量并儲存
至此前端的自動化部署已經完成,開發者送出代碼到主分支即觸發自動化部署