如何为Vercel的部署创建GitHub动作

为了更容易、更快速地创建项目

How to create Github Actions for Vercel Deployment

图片由作者提供

Vercel是最好的托管服务之一，因为它的简单性和适应性。它允许你以最快的速度托管你的项目，几乎不需要设置。当Vercel与GitHub一起用于项目部署时，事情变得更加迷人了。当一个新的更新被推送到GitHub时，这就实现了自动代码部署，简化了你的CI/CD工作流程。

什么是GitHub Actions？

GitHub Actions是一个CI/CD平台，用于自动化构建、测试和部署工作流程。你可以使用工作流程构建和测试仓库中的每一个拉动请求，也可以将合并后的拉动请求部署到生产仓库中。

GitHub Actions让你的所有软件活动自动化变得简单，它现在包括世界级的CI/CD，允许你定制代码审查、分支管理和问题分流。

GitHub动作如何与Vercel一起工作

GitHub动作会自动用Vercel部署你的GitHub项目，提供预览部署URL和自动自定义域名更新。当你在GitHub上创建一个新的Vercel项目并在每个分支上启用自动部署时，Vercel会观察该分支上的每个推送，并默认进行部署。如果Vercel已经在构建之前的提交，那么当前的构建将被取消，以构建最新的提交，这样你就总是有最新的变化被部署。

选项1用于测试。叉子模型
测试选项2：Tmate

测试GitHub动作的问题

GitHub 动作的实际应用

为了演示如何使用GitHub动作将应用程序部署到Vercel，我创建了一个简单的React项目并推送到我的GitHub仓库。把仓库克隆到你的电脑上，然后跟着做。

配置Vercel

要用Vercel设置GitHub动作，你需要一个Vercel项目ID和org ID。 要做到这一点，运行下面的命令并按照提示操作。

vercel

上述命令将生成一个 **.vercel/package.json** 文件，其中你的 **projectId**和 **orgId** 被生成。

也许，你可以告诉Vercel在你推送代码到GitHub时不要触发项目部署。这样，GitHub Actions工作流只有在有发布、推送到特定分支或手动触发工作流时才会被触发。要做到这一点，请在项目根目录下创建一个 **vercel.json**文件，并添加以下配置。

{ "github": {   "enabled": false,   "silent": true }}

接下来，你需要在Vercel上生成一个令牌，使你能够在GitHub行动上使用CLI。一旦你生成了令牌，复制令牌并保存在一个安全的地方。你以后会需要它。

然后推送你的项目到GitHub。推送完成后，进入GitHub上的项目。在设置标签中，点击 "秘密>行动"，将Vercel凭证添加到你的项目。在 "操作 "页面，点击 "创建仓库机密"按钮，添加以下机密。

**VERCEL_ORG_ID**:这就是 **orgId**中的 **.vercel/package.json**文件中的配置，在项目根目录下。
**VERCEL_PROJECT_ID**:这是在 **projectId**中的 **.vercel/package.json**项目根目录中的文件。
**VERCEL_TOKEN**:这是你生成的vercel令牌。

创建完上述凭证后，我们就应该准备配置工作流了。

配置GitHub工作流

将你的Vercel凭证添加到GitHub上的项目后，继续配置GitHub工作流，以实现持续和不断部署。要做到这一点，在项目根目录下创建一个 **.github/workflows/deploy.yml** 文件，并添加下面指定的配置。

现在提交修改，将代码推送到 GitHub。一旦代码被推送，GitHub 行动将触发自动部署。

总结

在本教程中，你已经学会了如何设置GitHub动作，将你的项目部署到Vercel。你了解了什么是GitHub动作，以及它们如何与Vercel一起工作。现在你已经了解了GitHub和Vercel是如何一起工作的，请随意浏览一些更多的配置，添加到你的项目中。

如何为Vercel的部署创建Github动作