搭建Vue3组件库:第九章 持续集成CI:基于GitHub的Action回归验证

简介: 本章介绍一下github的工作流的持续集成服务。

持续集成可以认为是一种优秀的开发实践,它可以在代码变更的时候及时反映代码状态。持续集成需要服务器的支持,可以考虑通过 gitlib ci 或者 jenkins 自己搭建持续集成服务器,更好的办法是使用第三方的持续集成服务,目前比较流行的有:

对于开源项目来讲由于代码无需闭源,完全可以使用第三方持续集成服务。


本章任务

  • 创建工作流 Workflow
  • 创建 Job
  • 运行 CI 服务;

Github Action 是一个集成服务,你可以认为它是一台远程运行的服务器。为了让同一台服务器为不同用户提供独立的配置,互不干扰,需要通过容器化技术实现虚拟机。也就是说使用 Github Action,其实就是在使用虚拟机。更准确地讲,其实就是在配置一个容器,它的配置非常类似于配置 Docker 容器配置。


task1】创建工作流 workflow

Github Action 的配置文件需要放在项目根目录下的 .github/workflows 中,每一个配置文件是一个工作流 Workflow 。一个工作流是可以配置多个自动化任务 (Job) 的。

比如,组件库的持续集成分为两个任务 (Job) 。一个任务是运行单元测试进行回归校验,另外一个是自动运行 lint 脚本校验代码风格。 这两个任务之间并没有先后关系,而且可以并行运行。这个时候就可以新建一个工作流并且配置两个任务。

首先创建一个 yaml 文件(文件名随意),编写 name 属性,name 属性最终会被显示到 Action 的执行界面中。

在这里插入图片描述

然后是确定触发器。所谓的触发器是指什么时候运行这个工作流 (Workflow),比如设置 pushpull_request 时触发,就是在 Github 收到 push 代码时和 pull_request 请求时触发。

我这里文件命名:main.yml, 路径:.github/workflows/main.yml

name: CI
on:
  push:
    branches: [ master ] // github默认分支是main,我这里是master
  pull_request:
    branches: [ master ] // github默认分支是main,我这里是master
jobs:
  Lint:
    # Lint任务
  UnitTest:
    # 单元测试任务

task2】创建 Job

下面来具体配置每一个Job。 Job 其实是一个运行任务,我们以 UnitTest 单元测试任务举例。

首先需要确定 Job 的 name,这个也会显示在执行界面中。

在这里插入图片描述

设定 runs-on 属性

run-on 是为了指定运行环境(Linux or Mac),其实你可以认为是这个任务虚拟机的环境,Github 可用的虚拟机有:

  • windows-(xxx version)
  • ubuntu-(xxx version)
  • Macos-(xxx version)

设置job的执行步骤

每一个 job 又包含多个 step, 每一个 step 是串行执行的。

你可以假定,在一个空的操作系统上,如果你想进行单元测试,则需要完成如下任务:

  • 安装 git 软件;
  • 检出 checkout 项目代码;
  • 安装 pnpm 软件;
  • 使用 pnpm 安装项目代码的依赖库;
  • 运行 pnpm run test

编写 step 可以使用下面三个方式:

  • run: 执行 shell 命令行命令;
  • env: 设置环境变量;
  • uses: 运行第三方 Action 脚本。

示例:

命令行是一种最好理解的执行方式,比如运行测试:

pnpm run test:run

你可以这样设置:

    - name: Run Test
      run: pnpm run test:run
但是对于一些比较复杂过程,自己配置起来就比较繁琐了,比如安装git。

首先要考虑不同系统,也需要确定是否有比如 apt-get 或 yum 等包管理工具。还需要运行安装并配置相应的环境变量。好在这些复杂操作大多数还是通用过程,这个时候就会用到 uses 来显神威了。

uses 可以用于Action。Action 可以认为是Github 提前写好的一些常用的脚本,当然这些脚本也支持自己定义。

marketplace

在这里插入图片描述

常见的通用操作包括:

  • 部署 (AWS 、App Engine 等各种云);
  • 代码 Review ;
  • 代码质量检测;
  • 监控;
  • 通知 (短信、飞书通知、钉钉)。

每个项目都遇到的常用操作,比如 checkout 检出代码、安装 pnpm 依赖等等,这些步骤显然不需要自己编写,直接使用脚本就可以了。

name: CI
on:
  push:
    branches: [ master ]
  pull_request:
    branches: [ master ]
jobs:
  # Lint:
    # Lint任务
  UnitTest:
    # The type of runner that the job will run on
    runs-on: ubuntu-latest
    # Steps represent a sequence of tasks that will be executed as part of the job
    steps:
      - uses: actions/checkout@v2
      - uses: pnpm/action-setup@v2.1.0
        with:
          version: 7.2.1
      - name: Install modules
        run: pnpm install
      - name: Run Test
        run: pnpm run test:run

其中运行单元测试的命令还进行了一些修改,因为 vitest 是默认伺服模式,也就是说,它不会在运行完成后退出,所以就需要增加一个非伺服模式的命令。

"scripts": {
    "test:run": "vitest run",
  },

task3】运行 CI 服务

运行 GitHub Action 比较简单,只需要将工作流配置文件提交并且 pushGithub 就可以了。

根据触发器的配置,持续集成脚本会在每次提交 push 代码的时候触发。

在这里插入图片描述
在这里插入图片描述
运行成功的话会显示绿色对钩。

如果失败,那么就会显示 ❌ 并且自动发送邮件通知。

相关文章
|
JavaScript 前端开发 持续交付
Prettier 高级应用:集成 CI/CD 流水线与插件开发
【10月更文挑战第18天】Prettier 是一款流行的代码格式化工具,它能够自动将代码格式化成一致的风格,从而提高代码的可读性和维护性。对于希望进一步发挥 Prettier 潜力的高级用户而言,将 Prettier 集成到持续集成(CI)和持续部署(CD)流程中,确保每次提交的代码都符合团队标准,是非常重要的。此外,通过开发自定义插件来支持更多语言或扩展 Prettier 的功能也是值得探索的方向。本文将详细介绍这两方面的内容。
413 2
|
人工智能 Kubernetes jenkins
容器化AI模型的持续集成与持续交付(CI/CD):自动化模型更新与部署
在前几篇文章中,我们探讨了容器化AI模型的部署、监控、弹性伸缩及安全防护。为加速模型迭代以适应新数据和业务需求,需实现容器化AI模型的持续集成与持续交付(CI/CD)。CI/CD通过自动化构建、测试和部署流程,提高模型更新速度和质量,降低部署风险,增强团队协作。使用Jenkins和Kubernetes可构建高效CI/CD流水线,自动化模型开发和部署,确保环境一致性并提升整体效率。
|
10月前
|
Cloud Native 中间件 调度
云原生信息提取系统:容器化流程与CI/CD集成实践
本文介绍如何通过工程化手段解决数据提取任务中的稳定性与部署难题。结合 Scrapy、Docker、代理中间件与 CI/CD 工具,构建可自动运行、持续迭代的云原生信息提取系统,实现结构化数据采集与标准化交付。
1060 1
云原生信息提取系统:容器化流程与CI/CD集成实践
|
存储 监控 Devops
DevOps实践:持续集成/持续部署(CI/CD)的实战指南
DevOps实践:持续集成/持续部署(CI/CD)的实战指南
|
监控 jenkins Shell
jenkins结合gitlab实现CI(持续集成)
通过本文的介绍,我们详细了解了如何结合Jenkins和GitLab实现持续集成。从环境准备、插件配置到Pipeline任务创建和CI流程监控,每一步都提供了详细的操作步骤和示例代码。希望本文能帮助开发者快速搭建起高效的CI系统,提高项目开发效率和代码质量。
1604 9
|
存储 运维 安全
Github Action:让静态网站实现定时发布
本文探讨了静态网站实现定时发布的解决方案,针对静态博客缺乏原生定时发布功能的问题,作者基于Zola工具构建的静态网站,最终选择通过GitHub Action实现定时发布。文章对比了几种实现方式,包括人力、自建服务及平台原生功能等,指出最理想的是利用平台能力但多数平台缺乏该功能。文中详细介绍了GitHub Action方案的原理、部署过程和使用流程,并分享了高级配置如推送通知。同时分析了方案的局限性,如时间颗粒度粗、设置繁琐等,并提出改进建议。总结中展望了未来优化方向,旨在提升静态网站维护体验。
288 0
|
存储 测试技术 持续交付
Docker与CI/CD的集成策略及其对软件开发效率和质量的提升作用
本文探讨了Docker与CI/CD的集成策略及其对软件开发效率和质量的提升作用。首先介绍了CI/CD的基本概念,接着阐述了Docker在环境一致性、快速部署、资源隔离和轻量化方面的优势。文章还详细讨论了构建、测试和部署阶段的具体集成方法,以及集成后带来的效率提升、可靠性增强、加速交付和易于管理等好处。最后,通过案例分析展示了集成的实际效果,强调了Docker与CI/CD结合的重要性和未来前景。
354 2
|
jenkins Java 持续交付
软件开发自动化程度的不断提高,持续集成(CI)和持续部署(CD)成为现代软件开发的重要组成部分
随着软件开发自动化程度的不断提高,持续集成(CI)和持续部署(CD)成为现代软件开发的重要组成部分。本文以电商公司为例,介绍如何使用 Jenkins 自动发布 Java 代码,包括安装配置、构建脚本编写及自动化部署等步骤,帮助团队实现高效稳定的软件交付。
218 3
|
对象存储
一个通过 GitHub Action 将 GitHub 仓库与阿里云 OSS 完全同步的脚本
一种将 GitHub 仓库完全同步到阿里云 OSS 的方法。
|
Devops jenkins 测试技术
DevOps实践:持续集成与持续部署(CI/CD)的实现之路
【9月更文挑战第33天】在软件开发的海洋中,DevOps是一艘能够加速航行、提升航程质量的巨轮。本文将作为你的航海图,指引你理解并实现DevOps文化中的核心环节——持续集成(CI)与持续部署(CD)。我们将从基础概念出发,逐步深入到实际操作,带你领略代码到部署的全过程。准备好扬帆起航,让我们共同探索如何通过自动化工具和流程优化,让软件交付变得既高效又可靠。