返回

通过 GitHub Actions 实现私有仓库的免费 Github Pages 部署

前端

前言

Github Pages 是 GitHub 提供的一项免费服务,允许用户通过托管静态网站来发布项目文档、个人博客或其他网络内容。传统上,GitHub Pages 仅适用于公共仓库,而私有仓库需要付费才能部署。然而,借助 GitHub Actions 的强大功能,现在可以免费实现私有仓库的 GitHub Pages 部署。

准备工作

设置私有仓库

  1. 创建一个新的私有仓库。
  2. 初始化一个 Git 仓库,并添加要部署的网站文件。
  3. 将仓库推送到 GitHub。

启用 GitHub Actions

  1. 在仓库设置中启用 GitHub Actions。
  2. 安装 GitHub Actions 的 pages 工作流。

部署流程

创建自定义工作流

为了在 GitHub Actions 中自定义部署流程,需要创建一个名为 .github/workflows/deploy.yml 的工作流文件。该文件指定了工作流的触发条件、使用的操作以及执行的步骤。

以下是示例工作流:

name: Deploy to Pages

on:
  push:
    branches:
      - main

jobs:
  build:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v3
      - run: npm install
      - run: npm run build
      - uses: actions/upload-artifact@v3
        with:
          name: artifact
          path: build

  deploy:
    needs: build
    runs-on: ubuntu-latest
    steps:
      - uses: actions/download-artifact@v3
        with:
          name: artifact
      - uses: JamesIves/github-pages-deploy-action@v4
        with:
          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
          BRANCH: gh-pages
          FOLDER: build

在这个工作流中,build 作业负责构建网站,将构建结果作为工件上传。deploy 作业下载工件并将其部署到 GitHub Pages 分支(默认为 gh-pages)。

部署配置

在工作流文件中,deploy 作业中 JamesIves/github-pages-deploy-action@v4 操作负责实际的部署过程。该操作需要以下配置:

  • GITHUB_TOKEN: GitHub 个人访问令牌,具有仓库的写入权限。
  • BRANCH: 要部署到的 GitHub Pages 分支的名称(默认为 gh-pages)。
  • FOLDER: 要部署的文件所在文件夹的名称(默认为 public)。

触发工作流

推送提交到仓库的主分支(例如 main)时,将触发 GitHub Actions 工作流。工作流将运行构建、上传工件和部署步骤,最终将网站部署到 GitHub Pages。

访问已部署网站

部署完成后,可以通过以下网址访问已部署的网站:

https://<username>.github.io/<repository-name>

其中 <username> 是仓库所有者的 GitHub 用户名,<repository-name> 是仓库的名称。

结论

通过使用 GitHub Actions,可以轻松实现私有仓库的免费 GitHub Pages 部署。自定义工作流允许用户根据自己的需求定制部署流程,而 JamesIves/github-pages-deploy-action@v4 操作简化了实际的部署过程。通过遵循本指南,用户可以轻松将他们的网站部署到 GitHub Pages,无需支付额外的费用。