GitHub Actions 部署到 GitHub Pages 教程

GitHub Actions 部署到 GitHub Pages 教程

1. 项目的目录结构及介绍

ghaction-github-pages/
├── .github/
│   └── workflows/
│       └── gh-pages.yml
├── .gitignore
├── LICENSE
├── README.md
└── action.yml

• .github/workflows/: 包含 GitHub Actions 的工作流配置文件。
• .gitignore: 指定 Git 忽略的文件和目录。
• LICENSE: 项目的开源许可证。
• README.md: 项目的介绍和使用说明。
• action.yml: GitHub Actions 的自定义动作配置文件。

2. 项目的启动文件介绍

项目的启动文件是 .github/workflows/gh-pages.yml。这个文件定义了 GitHub Actions 的工作流，用于将代码部署到 GitHub Pages。

name: GitHub Pages

on:
  push:
    branches:
      - main

jobs:
  deploy:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v2
      - uses: crazy-max/ghaction-github-pages@v2
        with:
          target_branch: gh-pages
          build_dir: dist

• name: 工作流的名称。
• on: 触发工作流的事件，这里是在 main 分支有推送时触发。
• jobs: 定义工作流中的任务。
• deploy: 任务的名称。
• runs-on: 任务运行的环境。
• steps: 任务中的步骤。
  • uses: 使用的外部动作。
  • with: 传递给动作的参数。

3. 项目的配置文件介绍

主要的配置文件是 action.yml，它定义了 GitHub Actions 的自定义动作的输入和输出。

name: 'GitHub Pages'
description: 'Deploy to GitHub Pages with GitHub Actions'
inputs:
  target_branch:
    description: 'Branch to deploy to'
    required: true
    default: 'gh-pages'
  build_dir:
    description: 'Directory to deploy'
    required: true
    default: 'dist'
runs:
  using: 'node12'
  main: 'dist/index.js'

• name: 动作的名称。
• description: 动作的描述。
• inputs: 定义动作的输入参数。
  • target_branch: 目标分支，默认是 gh-pages。
  • build_dir: 构建目录，默认是 dist。
• runs: 定义动作的运行方式。
  • using: 使用的运行时环境。
  • main: 入口文件。