部署 vue3 firebase web 应用程序的 Github Actions 问题

Question

我有一个使用 Vite 的 Vue 3 Web 应用程序。我添加了 Firebase，用于通过 GitHub 操作托管我的 Web 应用程序，以便在推送到主应用程序时进行部署。问题在于部署。手动发出 firebase 部署命令时效果很好。但在 GitHub 操作上，部署失败。这是 firebase.json 文件的托管属性。

  "hosting": {
    "public": "dist",
    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ],
    "rewrites": [
      {
        "source": "**",
        "destination": "/index.html"
      }
    ]
  }

这是 GitHub 操作的 yaml 工作流程文件。

name: Deploy to Firebase Hosting on merge
'on':
  push:
    branches:
      - main
jobs:
  build_and_deploy:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v3
      - uses: FirebaseExtended/action-hosting-deploy@v0
        with:
          repoToken: '${{ secrets.GITHUB_TOKEN }}'
          firebaseServiceAccount: '${{ secrets.FIREBASE_SERVICE_ACCOUNT_ASXVEC }}'
          channelId: live
          projectId: asxvec

错误发生在步骤

- uses: FirebaseExtended/action-hosting-deploy@v0

操作日志如下：

  ***
    "status": "error",
    "error": "Directory 'dist' for Hosting does not exist."
  ***

  The process '/usr/local/bin/npx' failed with exit code 1
  Retrying deploy with the --debug flag for better error output

然后日志继续，失败到下面

  === Deploying to 'asxvec'...
  
  i  deploying hosting 
  [2023-09-12T06:44:17.269Z] >>> [apiv2][query] POST https://firebasehosting.googleapis.com/v1beta1/projects/-/sites/asxvec/versions [none]
  [2023-09-12T06:44:17.269Z] >>> [apiv2][body] POST https://firebasehosting.googleapis.com/v1beta1/projects/-/sites/asxvec/versions ***"status":"CREATED","labels":***"deployment-tool":"cli-firebase--action-hosting-deploy"***
  [2023-09-12T06:44:17.761Z] <<< [apiv2][status] POST https://firebasehosting.googleapis.com/v1beta1/projects/-/sites/asxvec/versions 200
  [2023-09-12T06:44:17.762Z] <<< [apiv2][body] POST https://firebasehosting.googleapis.com/v1beta1/projects/-/sites/asxvec/versions ***"name":"projects/236890820692/sites/asxvec/versions/ca662e0c4223cfac","status":"CREATED","config":***,"labels":***"deployment-tool":"cli-firebase--action-hosting-deploy"***
  i  hosting[asxvec]: beginning deploy... 
  
  Error: Directory 'dist' for Hosting does not exist.
  
  The process '/usr/local/bin/npx' failed with exit code 1
  Error: The process '/usr/local/bin/npx' failed with exit code 1
  ***
    conclusion: 'failure',
    output: ***
      title: 'Deploy preview failed',
      summary: "Error: The process '/usr/local/bin/npx' failed with exit code 1"
    ***
  **

构建代码或手动将其部署到 Firebase 似乎没有其他问题。此错误纯粹存在于 Github 操作上。我没有看到工作流程 yaml 文件中使用了很多配置来尝试解决此问题。

Answer 1

问题在于您的操作脚本尝试部署代码而不构建它。 在部署之前添加以下行

- run: npm install && echo '-----Install Done 👌-----' && npm run build && echo '-----Build Done 👌-----'

firebase.json 的完整脚本应如下所示

name: Deploy to Firebase Hosting on merge
'on':
  push:
    branches:
      - main
jobs:
  build_and_deploy:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v3
      - run: npm install && echo '-----Install Done 👌-----' && npm run build && echo '-----Build Done 👌-----'
      - uses: FirebaseExtended/action-hosting-deploy@v0
        with:
          repoToken: '${{ secrets.GITHUB_TOKEN }}'
          firebaseServiceAccount: '${{ secrets.FIREBASE_SERVICE_ACCOUNT_ASXVEC }}'
          channelId: live
          projectId: asxvec