• 1

  • 469

  • 收藏

利用gitlab-ci从零开始实现前端自动化部署

智能的司机

我是老司机

5个月前

实现效果为:当某分支有git push操作,则自动打包并把打包好的代码发布到服务器上。

本次仅为学习并未实施到具体项目中,所以以demo的形式实现

一、搭建一个gitlab

我本机为windows系统,所以安装一个VMware并把Linux系统装上,用于搭建gitlab服务。Ubuntu的镜像直接去官网下载即可。

  • 1.安装依赖

sudo apt-get install curl openssh-server ca-certificates postfix
复制代码

如果要安装Postifx来发送邮件,在安装过程中选择Internet。

  • 2.安装gitlab ce

    • 在线安装
    curl -s https://packages.gitlab.com/install/repositories/gitlab/gitlab-ce/script.deb.sh | sudo bash
    sudo apt-get install gitlab-ce=13.4.6-ce.0
    复制代码
    • 离线安装
      这里你可以使用在线或者离线的安装方式,官方提供了安装包可直接下载。如果使用了清华镜像库里的rpm安装包,由于Ubuntu是基于debian的,所以得转成deb格式。

下载好deb文件后使用dpkg安装即可

dpkg -i gitlab-ce_13.4.6-ce.0_amd64.deb
复制代码

安装好后,打开/etc.gitlab/gitlab.rb,修改external_url

然后访问192.168.68.128(此地址是虚拟机ip地址),默认是在80端口上运行。如果能看到gitlab页面但是报500可能是虚拟机分配的内存太小,可适当调大。正常访问后会要求你设置一个超级管理员密码,设置好进去就可以开始创建你的项目了。

如果在线安装下载很慢,有两种替换镜像源的方式

  • 图形方式

在软件和更新里就能直接修改下载源

  • 修改配置文件

配置文件为/etc/apt/sources.list,里面加入你想要的镜像源即可,我用的阿里的镜像源,这是清华的镜像源使用帮助,你也可以在清华镜像官网直接找到Gitlab Community Edition 镜像使用帮助

二、安装Docker

为什么要装Docker?其实自动化部署docker也不是必须的,只不过接下来的gitlab runner是通过docker方式运行的,官方提到,gitlab runner必须安装在与gitlab不同的服务器上,原话

  • Before registering a runner, you need to first:
  • Install it on a server separate than where GitLab is installed
  • Obtain a token:
    • For a shared runner, have an administrator go to the GitLab Admin Area and click Overview > Runners
    • For a group runner, go to Settings > CI/CD and expand the Runners section
    • For a project-specific runner, go to Settings > CI/CD and expand the Runners section

这里我直接使用的官方的在线安装方式,在Ubuntu上安装docker

安装好后运行sudo docker run hello-world,如果看到以下信息则表示安装成功

三、安装并注册gitlab-runner

相关官方文档参考这里

1.获取gitlab runner最新镜像

docker pull gitlab/gitlab-runner:latest
复制代码

2.运行并注册gitlab runner

sudo docker run -it --name gitlab-runner  \
-v /srv/gitlab-runner/config:/etc/gitlab-runner \
-v /var/run/docker.sock:/var/run/docker.sock  \
gitlab/gitlab-runner:latest register
复制代码

最后的register如果已经注册过则可以不带,注册的时候会要求填上gitlab地址,项目token之类 1).输入你的gitlab地址
2).输入项目token,这里我使用的是项目对应的gitlab runner而非共享runner,具体可以在Settings->CI/CD->Runners里找到

3).输入runner的描述
4).输入runnertags
5).执行方式我这里是docker,输入docker即可
6).docker镜像与版本alpine:latest

之后再gitlab runners的页面就能看到如下

四、为项目编写gitlab-ci.yml

如果想要使项目在push时触发gitlab-ci,则在项目根目录下建一个.gitlab-ci.yml即可。 我简单的分为两个步骤,builddeploy.gitlab-ci.yml文件内容如下:

# 配置包含2个阶段build, deploy
stages:
  - build
  - deploy
cache: # 缓存
  paths:
    - node_modules
    - build

# build阶段前端项目构建任务
node-build:
  image: node:12.19.0
   # 在build阶段执行    
  stage: build
  # 根据 tag 匹配对应的 Group Runner
  tags:
    - nodejs
  # 只在指定的分支执行该job
  only:
    refs:
      #- dev
      - test
      - master
  
  # 执行脚本  
  script:
    # 安装依赖
    - yarn --registry=https://registry.npm.taobao.org
    # 执行构建程序 CI=false, 否则会将警告视为错误
    - CI=false npm run build

  # 打包后的文件可以在gitlab上直接下载 
  artifacts:
    paths:
      - build

# deploy阶段发布到NGINX
docker-build:
  image: ictu/sshpass
  # 在deploy阶段执行  
  stage: deploy
  tags:
    - nodejs
  # 只在指定的分支执行该job
  only:
    refs:
      #- dev
      - test
      - master
  # 执行脚本  
  script:
    - sshpass -p $PASSWORD scp -o StrictHostKeyChecking=no -r ./build/* $CUSTOM_USERNAME@$CUSTOM_IP:/var/www/html
复制代码

每当有push操作,gitlab runner会开始执行builddeploy两个步骤,可以在项目对应的Pipelines看到:

我使用的是scp直接将文件拷贝到远程服务器。-p $PASSWORD 为服务器密码。
-o StrictHostKeyChecking=no表示不做key的检查,否则会报权限不足。
-r ./build/* $CUSTOM_USERNAME@$CUSTOM_IP:/var/www/html表示将build下的所有文件递归拷贝到指定目录。
关于cache的问题,可以看这篇文章

出于安全考虑,密码等隐私信息我配置在gitlab上:

五、问题点

  • 每次构建都要重新拉取镜像造成构建过慢

# gitlab runner 的配置文件中 加入一行配置防止重复拉取镜像

pull_policy = "if-not-present"
复制代码
  • Treating warnings as errors because process.env.CI = true.

需要将CI设置为false,否则会将警告视为错误导致无法构建

  • deploy步骤产生的权限问题

可以给对应文件夹加入读写权限,这里进入到nginx文件夹

sudo chmod 777 html
复制代码

nginx配置文件在/etc/nginx目录下的nginx.conf

ubuntu安装nginx及其默认目录结构

ubuntu nginx的html目录为/var/www/html
centos nginx的html目录为/usr/share/nginx/html

免责声明:文章版权归原作者所有,其内容与观点不代表Unitimes立场,亦不构成任何投资意见或建议。

GitLab

469

相关文章推荐

未登录头像

暂无评论