我们正在继续我们系列的改进GitHub工作流的内容。我们已经讨论过基本的GitHub工作流。现在,让我们来看看GitHub Actions。
GitHub Actions 初看之下似乎很复杂,但实际上它们非常有帮助。它让你可以在工作流程中设置自动化任务,这会让工作变得更轻松、更有条理。
你可能在想——
- GitHub Actions究竟是什么?
- 它真的那么重要吗?
- 怎么用它呢?
别着急!别担心,本文会一一解答这些问题。我们会告诉你什么是 GitHub Actions,它的主要部分,它为什么有用,以及如何开始使用。
zh: 此处省略
GitHub Actions 是什么?
GitHub 操作是一个工具,可帮助你构建更优质的软件,不限于特定语言或平台,它是一个功能,可让你的工作流程自动化,比如自动构建、测试和部署你的项目,并将它们集成到仓库中,因此你可以将它与你的仓库一起使用,以实现自动化。
GitHub Actions 组件:
你可以配置 GitHub Actions 工作流程,使其在你的仓库中发生某个 事件类型 时触发,例如有人打开一个拉取请求或创建一个问题。你的工作流程包含一个或多个 作业,这些作业可以按顺序执行,也可以并行执行。每个作业将在自己的虚拟机 运行器实例 中运行,或者在容器中运行,并包含一个或多个 步骤,这些步骤要么运行你定义的脚本或命令,要么运行一个 操作,这是一个可重用的扩展,可以简化你的工作流程。
- 工作流程:
-
工作流是一组在
YAML
文件中描述的自动化任务。通常,它会被放置在仓库根目录下的.github/workflows
目录中。它描述了一个或多个可以由如代码推送、拉取请求等事件触发的任务。比如,你可以设置一个工作流,每当有新的拉取请求时就自动运行测试。 -
yaml
文件:是一种人类可读的数据序列化标准,可以与所有编程语言配合使用,并且经常用于编写配置文件。 .github
目录:是用来存放仓库配置文件的一个特殊目录,用于存储 GitHub Actions 工作流、问题模板和其他配置文件。- 步骤:
步骤是可以在工作流中重复使用的代码单元,可以是一个命令或脚本。步骤可以用来自动化您的工作流,比如构建、测试和部署您的代码。
- 步骤:
-
事件:
事件是在仓库中触发工作流运行的具体活动之一。例如,推送代码、创建拉取请求或发布新版本。 -
运行器:
运行器是在你的工作流被触发时运行这些工作流的虚拟机。你可以配置工作流在特定的虚拟机上运行,比如 Ubuntu、Windows 或 macOS。 -
工作和步骤:
一个工作流程由一个或多个任务组成,每个任务包含多个步骤。每个步骤要么是一个将执行的 shell 脚本,要么是一个将执行的操作。例如,你可以先构建应用程序,接着运行测试。 - Secrets :
Secrets 是加密后的环境变量,您可以在工作流中使用它们。您可以使用 Secrets 来存储敏感信息,例如 API 密钥、密码和令牌。例如,如果您想使用VERCEL_TOKEN
将您的应用部署到 Vercel,您可以将此令牌作为仓库中的秘密存储,并在工作流中使用它。
zh: zh: (此处省略)
让我们一起创建一个简单的 GitHub Actions 流程
我们要创建一个简单的GitHub Actions工作流,在每次推送代码到仓库时运行Eslint。下面来告诉你怎么做:
在你的 GitHub 仓库中,在 .github/workflows
目录下新建一个文件,创建一个工作流配置文件。你可以给文件起任何你喜欢的名字,但文件应该有 .yml
扩展名。比如说,可以命名为 main.yml
。
可以在 main.yml
文件里加上这些代码:
name: Eslint 检查 # 名称: Eslint 检查
on: [push] # 触发工作流的事件
jobs:
eslint: # 作业名称
runs-on: ubuntu-latest # 使用运行器
steps:
- name: 启动作业 # 步骤名称
run: echo "🚀 启动作业" # 要运行的命令
- name: 检出代码
uses: actions/checkout@v3 # 检出代码
- name: 安装依赖
run: npm ci # ci 用于更快地安装依赖
- name: 运行 Eslint
run: npx eslint .
-
提交更改并推送到您的代码库。
-
查看工作流程结果。
- 在你的 GitHub 仓库中,点击操作选项卡。
- 你应该能看到你的工作流程正在运行或已经完成。
就这样吧!你已经创建了你的第一个 GitHub Actions 工作流。现在,每当你推送代码时,Eslint 会自动运行检测你的代码。
让我们来创建一个更复杂一点的版本
我们的第二个任务是创建一个工作流程,在每次向主分支推送代码或提交拉取请求时运行Eslint和Prettier检查,然后构建应用程序。
name: Eslint, Prettier 及 构建
on:
push:
branches:
- main
pull_request:
branches:
- main
jobs:
eslint:
name: Eslint 检查
runs-on: ubuntu-latest
steps:
- name: 检出代码
uses: actions/checkout@v3
- name: 配置 node 环境
uses: actions/setup-node@v3
with:
node-version: '18'
- name: 安装依赖项
run: npm ci
- name: 运行 Eslint
run: npx eslint .
prettier:
name: Prettier 检查
runs-on: ubuntu-latest
steps:
- name: 检出代码
uses: actions/checkout@v3
- name: 配置 node 环境
uses: actions/setup-node@v3
with:
node-version: '18'
- name: 安装依赖项
run: npm ci
- name: 运行 Prettier
run: npx prettier --check .
build:
name: 构建应用程序
runs-on: ubuntu-latest
needs: # 这表示此作业依赖于前面的作业
- eslint
- prettier
steps:
- name: 检出代码
uses: actions/checkout@v3
- name: 配置 node 环境
uses: actions/setup-node@v3
with:
node-version: '18'
- name: 安装依赖项
run: npm ci
- name: 执行 npm run build
run: npm run build
全屏模式 退出全屏
咱们来创建我们的第三个也是最复杂的工作流
我们的第二个任务是创建一个工作流程,在每次向主分支提交拉取请求时自动运行Eslint和Prettier检查我们的代码,运行类型检查,构建应用程序并运行测试。
name: Eslint, Prettier, Typescript, Build, and Test
on:
pull_request:
branches:
- master
jobs:
eslint-prettier:
name: Eslint 和 Prettier 检测
runs-on: ubuntu-latest
steps:
- name: 进行代码检出
uses: actions/checkout@v3
- name: 设置 node 环境
uses: actions/setup-node@v3
with:
node-version: '18'
- name: 安装依赖
run: npm ci
- name: 运行 Eslint
run: npx eslint .
- name: 运行 Prettier
run: npx prettier --check .
typescript:
name: Typescript 检测
runs-on: ubuntu-latest
needs:
- eslint-prettier
- typescript
steps:
- name: 进行代码检出
uses: actions/checkout@v3
- name: 设置 node 环境
uses: actions/setup-node@v3
with:
node-version: '18'
- name: 安装依赖
run: npm ci
- name: 运行 Typescript 检测
run: npx tsc --noEmit
build:
name: 构建应用
runs-on: ubuntu-latest
needs:
- eslint-prettier
- typescript
steps:
- name: 进行代码检出
uses: actions/checkout@v3
- name: 设置 node 环境
uses: actions/setup-node@v3
with:
node-version: '18'
- name: 安装依赖
run: npm ci
- name: 构建应用
run: npm run build
test:
name: 运行测试
runs-on: ubuntu-latest
needs: build
steps:
- name: 进行代码检出
uses: actions/checkout@v3
- name: 设置 node 环境
uses: actions/setup-node@v3
with:
node-version: '18'
- name: 安装依赖
run: npm ci
- name: 运行测试
run: npm test
全屏模式 退出全屏
这里的工作流程是这样的:
(点击这里查看 GitHub Actions 工作流图示)
最后:
GitHub Actions 是一个强大的工具,帮助你自动化你的工作流程,让你的工作更轻松且更有条理。它让你设置自动任务,例如构建、测试和部署代码。你可以用它来自动化重复的任务,节省时间。
在这篇文章中,我们解释了什么是 GitHub Actions,它的主要部分,为什么它有用,以及怎样开始使用它。我们还共同创建了两个简单的 GitHub Actions 工作流程。希望这篇文章能帮助你更好地了解 GitHub Actions,并了解如何使用它来优化你的工作流程。
资源:
文章列表:
- 例如 https://docs.github.com/en/actions/writing-workflows/quickstart (GitHub Actions 快速入门指南)
- 例如 https://spacelift.io/blog/github-actions-tutorial (GitHub Actions 教程)
- 例如 https://codefresh.io/learn/github-actions/github-actions-tutorial-and-examples/ (GitHub Actions 教程与示例)
- 例如 https://vercel.com/guides/how-can-i-use-github-actions-with-vercel (如何在 Vercel 中使用 GitHub Actions)
视频来啦!
这些链接指向视频中的特定时间点,可以观看相关内容。
共同学习,写下你的评论
评论加载中...
作者其他优质文章