gitlab中vue前端项目CI/CD部署笔记

持续集成

略

Gitlab的持续集成

我们可以将整个运行机制，看作一个赏金猎人接任务，执行任务，并完成任务的过程。

GitLab-CI

简单来说，这就是一个任务发布平台。运行在gitlab服务器，监听代码状态变化，并发布对应的任务。

GitLab-Runner

而每个runner就是一位赏金猎人，是任务的执行者。

2020-05-22T06:04:52.png

.gitlab-ci.yml

任务的发布者，规定什么时候触发任务，任务的具体内容。

配置流程

经过前面的解释，整个思路就很清晰了。我们需要做的有三件事。

编写.gitlab-ci.yml文件，设置对应的任务
部署Runner，激活赏金猎人
配置ci，邀请赏金猎人加入系统

部署Runner

这一步需要一个服务器，能run起来赏金猎人。

安装

请务必安装最新版，不然会出现很多未知的问题

下载二进制文件

# Linux x86-64
sudo curl -L --output /usr/local/bin/gitlab-runner https://gitlab-runner-downloads.s3.amazonaws.com/latest/binaries/gitlab-runner-linux-amd64

# Linux x86
sudo curl -L --output /usr/local/bin/gitlab-runner https://gitlab-runner-downloads.s3.amazonaws.com/latest/binaries/gitlab-runner-linux-386

# Linux arm
sudo curl -L --output /usr/local/bin/gitlab-runner https://gitlab-runner-downloads.s3.amazonaws.com/latest/binaries/gitlab-runner-linux-arm

# Linux arm64
sudo curl -L --output /usr/local/bin/gitlab-runner https://gitlab-runner-downloads.s3.amazonaws.com/latest/binaries/gitlab-runner-linux-arm64

授予执行权限

sudo chmod +x /usr/local/bin/gitlab-runner

Create a GitLab CI user:

sudo useradd --comment 'GitLab Runner' --create-home gitlab-runner --shell /bin/bash

Install and run as service:

sudo gitlab-runner install --user=gitlab-runner --working-directory=/home/gitlab-runner
sudo gitlab-runner start

加入任务系统

sudo gitlab-runner register

然后就是一些简单的配置，配置完成后就将该Runner注册到任务发布平台了，然后就可以接任务了。详细见参考文献【1】

编写.gitlab-ci.yml任务

本机部署版本
.gitlab-ci.yml

stages:
  - deploy

cache:
  paths:
    - node_modules/
    - public/

deployJob:
  stage: deploy 
  script:
    - npm install 
    - npm run build
    - rm -rf /home/data/three_miju_shopper_manager_system_front/*
    - cp -rf ./dist/* /home/data/three_miju_shopper_manager_system_front/
    - sh ./bot.sh ${CI_COMMIT_REF_SLUG} ${CI_COMMIT_SHA:0:8} ${CI_COMMIT_MESSAGE}
  tags:
    - shared_test_machine_runner
  only:
    - dev

这个版本具有企业微信群机器人推送功能，需要配置./bot.sh

#!/usr/bin/env bash
curl '群机器人地址' \
      -H 'Content-Type: application/json' \
      -d '
      {
        "msgtype": "markdown",
        "markdown": {
          "content": "商户端代码已更新，分支:'$1' 提交:'$2'
          更新：'$3'
          已发布，[点击测试](http://test.shop.gileey.cn)"
        }
      }'

远程推送版本

stages:
  - deploy

cache:
  paths:
    - node_modules/
    - public/

deployJob:
  stage: deploy 
  script:
    - mkdir -p ~/.ssh
    - echo "$SSH_PRIVATE_KEY" >> ~/.ssh/id_dsa
    - chmod 600 ~/.ssh/id_dsa
    - echo -e "Host *\n\tStrictHostKeyChecking no\n\n" > ~/.ssh/config
    - rsync -avzu --progress ./dist/* root@thinkmoon.cn:/www/wwwroot/3ju.psyannabel.cn/
  tags:
    - shared_test_machine_runner
  only:
    - dev

该版本在gitlab-runner机器上执行编译等工作，编译完成后使用rsync同步到云服务器，需要配置私钥变量$SSH_PRIVATE_KEY

2020-05-30T14:20:12.png

遇到的问题

导入自定义组件时一直报错：This dependency was not found:

出现背景：由于以前命名组件是"clickImg",后改成"ClickImg",由于linux的区分大小写，所以会一直没找到。

解决方案：换个名字？？？

参考文献

版权声明: （https://www.thinkmoon.cn/post/849）
本文首发于指尖魔法屋-gitlab中vue前端项目CI/CD部署笔记
转载或引用必须申明原指尖魔法屋来源及源地址！