10分钟教你自动化部署前端项目

背景

前几年，作为小白的我，只需要安安心心写前端代码就行，前端代码部署的事情直接交给运维人员去部署，部署到哪台服务器，这些都不需要我们关心。

突然，运维人员离职了，没办法，业务需要又起了一个项目，没有运维人员的我们只能每次本地编译完毕，然后手动同步到服务器目录，累成个狗了！累就要想办法解决。

GitLab CI

我们的项目中经常有一个.yml文件，有很多人不知道这个文件是干什么用的。

GitLab CI/CD（后简称 GitLab CI）是一套基于 GitLab 的 CI/CD 系统，可以让开发人员通过 .gitlab-ci.yml 在项目中配置 CI/CD 流程，在提交后，系统可以自动/手动地执行任务，完成 CI/CD 操作。

说的通俗一点，就是这个yml文件的作用是我们提交代码到GitLab以后，GitLab CI会自动读取yml文件中的内容，进行对应的操作。gitlab只是代码仓库，想要实现CI/CD,我们需要安装gitlab-runner。gitlab-runner相当于任务执行器。

下载安装

例如我们在测试服务器（9.138）上安装git-runner

首先我们下载安装git-runner

# 下载 

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

# 给予执行权限 

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

# 创建一个CI用户

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

# 安装并且运行服务

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

sudo gitlab-runner start

注册runner

gitLab查看runner

使用注册好的runner

编写.gitlab-ci.yml文件，先了解一些基本概念

1. Pipeline

一次 Pipeline 其实相当于一次构建任务，里面可以包含多个流程，如安装依赖、运行测试、编译、部署测试服务器、部署生产服务器等流程。 任何提交或者 Merge Request 的合并都可以触发 Pipeline，如下图所示：

2. Stages

Stages 表示构建阶段，说白了就是上面提到的流程。 我们可以在一次 Pipeline 中定义多个 Stages，这些 Stages 会有以下特点：

• 
  
• 所有 Stages 会按照顺序运行，即当一个 Stage 完成后，下一个 Stage 才会开始
  
• 只有当所有 Stages 完成后，该构建任务 (Pipeline) 才会成功
  
• 如果任何一个 Stage 失败，那么后面的 Stages 不会执行，该构建任务 (Pipeline) 失败
  

因此，Stages 和 Pipeline 的关系就是：

2. Jobs

Jobs 表示构建工作，表示某个 Stage 里面执行的工作。 我们可以在 Stages 里面定义多个 Jobs，这些 Jobs 会有以下特点：

• 
  
• 相同 Stage 中的 Jobs 会并行执行
  
• 相同 Stage 中的 Jobs 都执行成功时，该 Stage 才会成功
  
• 如果任何一个 Job 失败，那么该 Stage 失败，即该构建任务 (Pipeline) 失败
  

所以，Jobs 和 Stage 的关系图就是：

下面我们来写一个简单的.gitlab-ci.yml

注意

安装git-runner的服务器需要安装git，不然你可能看到一下错误：

后语

欢迎大家多提意见。项目模板在不断优化，一赞一回！欢迎评论。