1、根據(jù)GitHub提供的文檔生成密鑰，生成好后記得復(fù)制下來，要不然再訪問頁面的時候密鑰就不展示了。

# 生成密鑰時主要需要開啟的權(quán)限有
1、rope 下所有權(quán)限
2、admin:repo_hook 下所有權(quán)限
3、delete_repo 下所有權(quán)限
# 主要是關(guān)于rope的權(quán)限，盡量都開啟

2、在要使用Actions功能的倉庫的Settings中的Secrets中新增一條。

Name為:ACCESS_TOKEN
Value為:剛才生成好的密鑰

3、在項目的package.json文件中找到homepage字段，沒有的話就新增一個。

"homepage": "https://[GitHub的用戶名].github.io/[使用Actions功能的倉庫名]"

4、在使用Actions功能的倉庫的根目錄添加一個.github目錄，并在其中新增一個workflows目錄，在workflows目錄中再新增一個任意名字的.yml文件。

# 自定義當(dāng)前執(zhí)行文件的名稱
name: GitHub Actions Build and Deploy Demo
# 整個流程在master分支發(fā)生push事件時觸發(fā)
on:
  push:
    branches:
      - master
jobs:
  build-and-deploy:
    runs-on: ubuntu-latest # 運行在ubuntu-latest環(huán)境的虛擬機中
    steps:
    # 獲取倉庫源碼
    - name: Checkout
      uses: actions/checkout@v2
      with:
        persist-credentials: false
    # 構(gòu)建和部署
    - name: Install and Build
      # 由于示例項目代碼并非在根目錄,所以要這里手動進入了項目目錄
      # 如果你代碼本身就處于根目錄則不需要再手動進入了
      run: |
        cd ./react_project
        npm install
        npm run-script build
    # 發(fā)布
    - name: Deploy
      uses: JamesIves/github-pages-deploy-action@releases/v3
      # 環(huán)境變量
      with:
        ACCESS_TOKEN: ${{ secrets.ACCESS_TOKEN }} # GitHub 密鑰 ACCESS_TOKEN 是在第二步Settings的Secrets中新增時定義的Name,要保持一致
        # 發(fā)布到指定分支
        BRANCH: gh-pages
        # 構(gòu)建成果所在目錄,默認(rèn)位置都是在根目錄
        FOLDER: ./react_project/build

5、修改代碼->發(fā)布到倉庫->在倉庫的Actions中可以看到構(gòu)建過程，構(gòu)建結(jié)束后可以在第三步設(shè)置的homepage地址中看到效果。