如何创建工作流以在 React 和 Gatsby 应用程序上部署到 Github 页面?

How to create a workflow to deploy on a React & Gatsby app to Github pages?

我创建了一个工作流来自动执行 npm run deploy 每当我将内容推送到我的回购的 main 分支时,以保持 Github 页面的网站更新。

# This workflow will do a clean install of node dependencies, cache/restore them, build the source code and run tests across different versions of node
# For more information see: https://help.github.com/actions/language-and-framework-guides/using-nodejs-with-github-actions

name: Node.js CI

on:
  push:
    branches: [ main ]
  pull_request:
    branches: [ main ]

jobs:
  build:

    runs-on: ubuntu-latest

    strategy:
      matrix:
        node-version: [12.x, 14.x, 16.x]
        # See supported Node.js release schedule at https://nodejs.org/en/about/releases/

    steps:
    - uses: actions/checkout@v2
    - name: Use Node.js ${{ matrix.node-version }}
      uses: actions/setup-node@v2
      with:
        node-version: ${{ matrix.node-version }}
        cache: 'npm'
    - run: npm ci
    - run: npm run build --if-present
    - run: npm test
    
    - name: Deploy
      run: |
        git config --global user.name $user_name
        git config --global user.email $user_email
        git remote set-url origin https://${github_token}@github.com/${repository}
        npm run deploy
      env:
        user_name: 'github-actions[bot]'
        user_email: 'github-actions[bot]@users.noreply.github.com'
        github_token: ${{ secrets.ACTIONS_DEPLOY_ACCESS_TOKEN }}
        repository: ${{ github.repository }}

所以基本上我使用了默认 node.js workflow 并添加了有关 Github 页面的部分,但工作流程一直失败。

我有以下错误:

build(12.x) 
 npm test
  shell: /usr/bin/bash -e {0}

> react-portfolio@0.1.0 test /home/runner/work/my-portfolio/my-portfolio
> echo "Write tests! -> https://gatsby.dev/unit-testing" && exit 1

Write tests! -> https://gatsby.dev/unit-testing
npm ERR! Test failed.  See above for more details.

我该如何解决这个问题?

echo "Write tests! -> https://gatsby.dev/unit-testing" && exit 1

这是默认情况下 运行 npm run test 时的输出(在大多数 starters 中):

"test": "echo \"Write tests! -> https://gatsby.dev/unit-testing\" && exit 1"

基本上,这是提示 echo 消息并退出操作 (&& exit 1)。这就是您的工作流程中断的原因。

因此,对于您当前的用例,我会保留如下工作流程:

   - name: Use Node.js ${{ matrix.node-version }}
      uses: actions/setup-node@v2
      with:
        node-version: ${{ matrix.node-version }}
        cache: 'npm'
    - run: npm ci
    - run: npm run build --if-present

将来,如果您 运行 测试,您将需要更改命令以添加自定义单元测试而不跳过该过程。