GitHub Actions部署Gatsby时gatsby-plugin-manifest报不支持图片格式错误

1. 先解决Node版本不一致问题 #

你当前的GitHub Actions配置没有显式指定Node版本，ubuntu-latest运行环境的默认Node版本会持续更新，和你本地的v14.13.1存在差异，这是问题的核心诱因。

• 首先临时在workflow中增加版本打印步骤，确认线上运行的Node版本：
  在build和deploy job的actions/checkout@v2步骤后添加以下内容：

- name: 输出Node与npm版本
  run: |
    node -v
    npm -v

执行一次Action即可看到当前线上使用的版本，确认和本地的差异。

• 显式指定workflow的Node版本和本地一致，使用官方setup-node动作，修改后的workflow配置参考：

name: Build
on:
  push:
    branches:
      - master
jobs:
  build:
    name: Build
    runs-on: ubuntu-latest
    steps:
      - name: Checkout Repo
        uses: actions/checkout@v2
      - name: 指定Node版本
        uses: actions/setup-node@v3
        with:
          node-version: '14.13.1'
      - name: 安装依赖
        run: npm ci
      - name: 执行构建
        run: npm run build
      # 如果你需要在job之间传递构建产物，这里要加upload-artifact步骤
      - name: 上传构建产物
        uses: actions/upload-artifact@v3
        with:
          name: public
          path: public
  deploy:
    name: Deploy
    needs: build
    runs-on: ubuntu-latest
    steps:
      - name: Checkout Repo
        uses: actions/checkout@v2
      - name: 指定Node版本
        uses: actions/setup-node@v3
        with:
          node-version: '14.13.1'
      - name: 下载构建产物
        uses: actions/download-artifact@v3
        with:
          name: public
          path: public
      # 这里补充你自己的部署逻辑

注意：你当前的配置只有代码拉取步骤，缺少依赖安装、项目构建、部署逻辑的相关步骤，属于配置不完整，需要按照实际部署需求补充。

2. 修复gatsby-plugin-manifest报错 #

你使用的gatsby-plugin-manifest@2.4.9属于比较旧的版本，对高版本Node、非PNG格式的图标兼容性差：

• 检查gatsby-config.js中该插件的icon配置，确认指定的图标文件存在，且格式为PNG，避免使用SVG、WebP等格式
• 如果统一Node版本后还是报错，可以删除本地的node_modules、package-lock.json，使用对应版本的Node重新安装依赖后执行构建，即可复现线上错误

3. 本地复现验证 #

可以通过nvm工具安装GitHub Actions上运行的对应Node版本，再重新执行依赖安装和构建流程，即可1:1复现线上错误。

内容的提问来源于stack exchange，提问作者user16733667