CI/CD tutorial using GitHub Actions

2025-06-07

使用 GitHub Actions 的 CI/CD 教程

如何使用GitHub Actions在云端创建一个管道,用于频繁、自动地检查应用代码质量。例如,对托管在 GitHub 上的应用进行 lint、测试和构建。

这篇文章是写给谁的?

如果您想开始使用 CI/CD 或部署管道、自动化测试或仅使用 GitHub Actions,那么这篇文章适合您。

或者如果您只是对探索行动感兴趣并且只想知道 GH 行动的意义。

我们将从一个简单的 Hello World 流程开始,该流程在 shell 中运行一个问候语,然后转到一个适用于 Node.js 应用的流程。你只需要一个 GitHub 帐户和一个可以添加工作流程的仓库。

概述

您将在这篇文章中了解到什么。

  • 如何为您的代码创建一个基本的部署管道,可以快速、轻松且免费地设置。
  • 每当有人推送到你的代码库时,它都可以在云端运行。当出现故障时,它会发出警告。所以,即使你忘记在本地运行测试,或者在 GitHub UI 中编辑了代码,也能得到保障。
  • GitHub 支持名为GitHub Actions的管道服务,本文对此进行了介绍。
  • 我们将在本文中创建示例工作流程来运行 Hello World 流程,使用 shell 命令打印消息。
  • 然后我们为 Node.js 应用程序创建一个流程 - 使用此模板来帮助您入门。

更新:感谢大家的支持!这是迄今为止我最受欢迎的帖子。

什么是 GitHub Actions?

GH Actions 让我们使用 GH 的云基础设施对我们的 repo 代码运行 shell 命令,并在事件(如提交、PR 或计划)上触发。

您可以在 Actions“市场”中找到一个可用的“Action”——它就像一个插件,让您无需自己编写代码即可在工作流程中执行更复杂的任务。但这不是本文的重点。

请参阅GitHub 上的操作页面。

什么是部署管道?💡

这篇文章讨论如何创建“CI/CD”或“持续集成/持续部署”管道。

GH Actions 文档在这里很好地解释了这些术语,否则请参阅下面的解释。

名称中的“集成”部分指的是测试你的代码。通常,你会把本地运行的命令放到远程服务中运行。你正在测试你的提交如何与现有代码库集成,例如对拉取请求进行检查,并阻止合并,直到测试通过。

“部署”部分是关于频繁部署代码 - 本文未涉及此内容,但是您可以使用一个管道文件来处理 CI 和 CD 部分。

“持续”部分是指在每次推送和拉取请求时自动运行流水线。您无需记住在本地运行检查,因为这可能很繁琐或容易被遗忘。您只需推送本地提交,或在 GitHub 上更改文件,流程即可运行。对于部署,您无需使用 SSH 或 FTP 连接到远程服务器 - 只需提交并推送,您的站点即可部署!流水线减少了工作量,并确保您能够频繁测试质量和部署代码。

您可以使用 Travis 或 CircleCI 之类的工具,但我的经验主要集中在GitHub Actions上,所以这里就不多说了。如果您使用 GitLab,请参阅这篇文章

创建新管道

如何在 GH Actions 上创建 Hello World 工作流

行动图标

1. 选择一个仓库

创建一个新的 GitHub 仓库。

或者选择一个现有的。代码库里有什么代码并不重要——第一部分实际上不会用到这些代码。但是如果你有一个 Node.js 代码库,那就选择它,因为它以后会用到。

2. 创建工作流程

点击你的代码库上的“操作”选项卡。请注意,你可以在任何代码库上查看该选项卡,但只有你拥有该代码库的编辑权限才能编辑工作流程。

“操作”选项卡

如果您还没有工作流(用于管道的配置文件),系统将提示您创建一个。

与其选择模板,不如选择“跳过”选项(跳过此步骤并自行设置工作流程)。您可以随时回来使用 Node.js 或 Python 模板等添加其他工作流程。

您将进入编辑器视图,用于编辑名为 的新文件.github/workflows/main.yml。您可以保留原路径。

示例中的注释会非常冗长,而且您还不需要了解所有内容,因此您可以删除文件内容。

粘贴以下简单内容:

name: CI

on: push

jobs:
  build:
    runs-on: ubuntu-latest

    steps:
      - uses: actions/checkout@v2

      - name: Run a one-line script
        run: echo "Hello, world!"
Enter fullscreen mode Exit fullscreen mode

需要注意的关键部分是触发器(on推送事件)和steps(在标记为“作业”的命令中运行)。您可以将作业命名为任意名称(无空格)。大多数情况下,您只需要一个作业。

您可以设置任意数量的步骤。最后一步中,可选name字段仅用于记录日志,但run它是在 Shell 中运行的命令。我们在这里使用 Ubuntu,因为这是操作的典型选择。

现在保存您的文件 - 单击 GH 右上角的“开始提交”或提交并在本地推送。

如果您愿意,您可以查看有关配置工作流的GH Actions 文档或继续。

请注意,工作流配置文件使用YAML 语法,类似于 JSON,但可读性更强。请参阅YAML 教程了解更多信息。

⚠️ 注意,缩进非常重要!如果工作流编辑器或构建结果发现语法错误,请确保代码缩进与示例一致。顺便提一下,YAML 的缩进只有 2 个空格。

3.查看日志

您已使用该文件添加了新的提交,因此您的工作流程的“推送”条件将被触发,并且它将立即针对当前代码运行。

查看“操作”选项卡并找到此工作流运行的日志 - 在本例中只有一次运行。

工作流程应该记录已成功检出你的代码库,然后运行一步打印问候语。最后,它会以绿色复选标记结束。

4. 让它失败

编辑您的工作流文件。添加另外 2 个步骤。

为了模拟安装失败、lint 错误或单元测试失败,下一步将以非零代码退出,这表示错误状态。exit 1您也可以尝试使用错误的语法或操作不存在的文件,例如mv foo bar

    steps:
      - uses: actions/checkout@v2

      - name: Greeting
        run: echo "Hello, world!"

      - name: Simulate an error
        run: echo "About to fail" ; exit 1

      - name: Another greeting
        run: echo "Hello, world!"
Enter fullscreen mode Exit fullscreen mode

由于构建将被中止,因此无法达到最后一步。

保存文件。现在,当您查看最新版本时,您将看到一条错误消息。

您还应该会收到一封电子邮件,告知您构建失败。您还会在 GH 个人资料的通知部分收到通知。

运行 Node.js 应用管道 ☕

好吧,你对 Hello World 感到厌烦了吗?让我们继续学习 Node.js 的工作流程。

如果您想要一个完整但简单的 Node.js 仓库,其中包含脚本、已配置的构建命令以及 GH Actions 设置,那么您可以在自己的仓库中获取此模板项目的副本。管道将从第一次提交开始自动运行。

https://github.com/MichaelCurrin/node-project-template

否则请继续往下操作。

1. 设置文件

如果您已有 Node.js 项目,可以直接使用。或者,您可以按照以下说明将文件添加到空的仓库。

就本教程而言,如果您手头没有 Node.js 应用程序,那么您可以使用没有 JS 代码且只有一个package.json文件的 repo,如下所示:

{
  "name": "First CI app",
  "dependencies": {
    "lodash": "*"
  },
  "scripts": {
    "lint": "echo 'Linting!'",
    "build": "echo 'Running a build!'",
    "test": "echo 'Running unit tests!'",
  }
}
Enter fullscreen mode Exit fullscreen mode

2. 选择你的命令

假设我们有这些命令,按顺序在 Node.js 项目中本地运行。

npm install
npm run lint
npm run build
npm test
Enter fullscreen mode Exit fullscreen mode

我们将把每个步骤放在我们的工作流程中。

3. 设置工作流程

您可以编辑现有的简单工作流文件或使用不同的文件名添加新的文件。

复制以下内容并粘贴到工作流文件中。例如.github/workflows/main.yml

name: Node CI

on: push

jobs:
  build:
    runs-on: ubuntu-latest

    steps:
      - name: Checkout 🛎️
        uses: actions/checkout@v2
        with:
          persist-credentials: false

      - name: Install 🔧
        run: npm install

      - name: Lint 🧐
        run: npm run lint

      - name: Build 🏗️
        run: npm run build

      - name: Test 🚨
        run: npm test
Enter fullscreen mode Exit fullscreen mode

GH Actions 环境已自带 Node.js。所以无需为此操心——除非您需要特定版本,或者希望在一次工作流运行中针对多个版本运行。

4.查看日志

转到“操作”选项卡并单击以深入了解您的构建日志。

或者前往仓库的主选项卡。在提交旁边,您会看到一个橙色的“进行中”圆点,或者一个红色X或绿色的勾号。点击它即可查看构建结果。

提交哈希的操作状态:

打钩

在此处查看示例结果或参见下面的屏幕截图。

结果

您可以单击每个步骤旁边的箭头来查看更详细的控制台输出。

5. 添加徽章

为了清楚地说明您的构建状态,请在您的文档中添加徽章。

  1. 点击进入特定的工作流程运行。
  2. 在右上角的菜单中,点击“创建状态徽章”并复制结果。
  3. 将其添加到您的README.md文件并保存。

这是我的模板项目的徽章示例:

节点 CI

[Node CI](https://github.com/MichaelCurrin/node-project-template/workflows/Node%20CI/badge.svg)
Enter fullscreen mode Exit fullscreen mode

我还喜欢将图像包装在指向“操作”选项卡的链接中,以便于查看最新的运行。

接下来呢?🚀

您可以返回“操作”选项卡并创建新的工作流。探索其他使用 Python、Rust、Ruby 等语言的示例工作流。

另请参阅GitHub Actions 文档

还不明白吗?观看YouTube 视频,100 秒学会 DevOps CI/CD

如果您对此感兴趣,我写了一篇关于使用 GH Actions进行 GH Pages 部署的教程。

我在下面添加了一些资源,以帮助您学习流程。您可以选择其中一个,在您的工作流程中尝试一下。

如果您是编写测试的新手,或者想要探索 Jest 和 Mocha 作为 JS 的测试框架,我可以推荐这篇dev.to 文章

给我样品!

如果你是 Node.js 开发者,我的“代码手册”里收集了一些更高级的示例,相信会对你有所帮助。请参阅Node.js 工作流程

如果您对其他工具或语言感兴趣,请参阅我的《代码手册》中的“工作流”部分。“GH Pages”部分介绍了如何构建静态网站(例如 Jekyll 或 Hugo)或 Node.js 应用(例如 React),并将其作为 GH Pages 网站提供服务。

向我展示真实的工作流程

如果您对React感兴趣,不妨试试我的React Create App Quickstart仓库。它基于标准 React 模板,但我添加了一个 GitHub Actions工作流程来运行检查并部署到 GitHub Pages。点击“使用此模板”即可将项目副本添加到您自己的仓库。

我的“代码手册”中也介绍了Python,因为这是我首选的语言。

如果您想查看正在使用的 Python 操作,请参阅我的Unicron项目:

结论

我希望我提供的步骤、片段和资源能够帮助您部署管道,无论是新手还是有经验的人。

有什么建议可以改进这篇文章,或者让我在文章末尾添加链接吗?我能帮您做些什么,比如其他语言的 GH 工作流程?

谢谢阅读。

致谢

文章来源:https://dev.to/michaelcurrin/intro-tutorial-to-ci-cd-with-github-actions-2ba8
PREV
JS 中的函数式编程:Functor——Monad 的小兄弟
NEXT
CSS骨架加载屏幕动画