如果想把github项目部署到Github Page上有两种方法。我使用的第一种。

第一种是直接在github上新建一个<user>.github.io的仓库,名字必须是这个。打包文件push到这个仓库中就可以在<user>.github.io上浏览了。

第二种是在推送的仓库中新建一个gh-pages分支，名字必须是这个否则Settings中选择不了其他名字的分支。然后在项目Settings的Options中的Github pages选项中选中gh-pages分支。并支持修改主题和域名。就可以在<user>.github.io/你的仓库名地址浏览了。

1. 点击要使用仓库的Actions。选择设置一种workflow模板。
   
2. 这里我选择Node.js的模板
   选择后配置相关动作和流程，然后提交就可以了。提交后会在仓库中生成./github/workflows/xxx.yml文件以后每次执行配置的动作就可以自动执行配置的流程。
   
3. vuepress项目中的workflow配置代码

name: github pages

on:
  push:
    branches:
    - master

jobs:
  build-deploy:
    runs-on: ubuntu-latest
    steps:
    - uses: actions/checkout@v1
    - run: npm ci # 相当于npm install
    - run: npm run docs:build

    #发布到mybells.github.io/master
    - name: Deploy mybells.github.io/master
      uses: peaceiris/actions-gh-pages@v2
      env:
        ACTIONS_DEPLOY_KEY: ${{ secrets.ACTIONS_DEPLOY_KEY }}
        EXTERNAL_REPOSITORY: mybells/mybells.github.io #可以新建一个mybells.github.io仓库发布到master
        PUBLISH_BRANCH: master
        PUBLISH_DIR: docs/.vuepress/dist
      with:
          emptyCommits: false

    # #发布到MyBlog/gh-pages 查看https://mybells.github.io/MyBlog/，需要修改base配置为MyBlog，修改图片路径
    # - name: Deploy MyBlog/gh-pages
    #   uses: peaceiris/actions-gh-pages@v2
    #   env:
    #     ACTIONS_DEPLOY_KEY: ${{ secrets.ACTIONS_DEPLOY_KEY }}
    #     PUBLISH_BRANCH: gh-pages #也可以在本项目MyBlog新建gh-pages分支，名字一定要是gh-pages这样github page设置才能识别到这个分支，其他名字识别不到。https://help.github.com/cn/github/working-with-github-pages/creating-a-github-pages-site#creating-your-site
    #     PUBLISH_DIR: docs/.vuepress/dist
    #   with:
    #       emptyCommits: false

以上代码的意思是：

1. 当push文件到仓库上时触发流程。
2. 使用actions/checkout@v1插件拉取代码。并下载依赖包npm install和打包项目npm run build。
3. 使用peaceiris/actions-gh-pages@v2插件发布到相关仓库中。