构建后找不到Angular输出文件夹的GitHub Action问题

GitHub Actions里每个Job都是在独立的虚拟机环境中运行的，彼此的文件系统完全隔离。你的build Job生成的./dist/目录只存在于它自己的runner环境里，deploy Job重新执行actions/checkout@v3只会拉取原始源码，不会带上build Job的构建产物，自然找不到./dist/目录。

有两种实用的修复方式，按需选择：

方案一：合并构建与部署到同一个Job #

把部署步骤直接放到build Job里，所有步骤在同一个runner环境执行，构建产物可以直接被使用，流程更简单：

name: 🛠️ Build Angular App
on:
  push:
    branches:
      - main

jobs:
  build-and-deploy:
    runs-on: ubuntu-latest
    strategy:
      matrix:
        node-version: [16.x]

    steps:
      - uses: actions/checkout@v3

      - name: Cache node modules
        uses: actions/cache@v1
        with:
          path: ~/.npm
          key: ${{ runner.os }}-node-${{ hashFiles('**/package-lock.json') }}
          restore-keys: |
            ${{ runner.os }}-node-

      - name: Node ${{ matrix.node-version }}
        uses: actions/setup-node@v1
        with:
          node-version: ${{ matrix.node-version }}

      - name: npm ci and npm run build
        run: |
          npm ci
          npm run build

      - name: ⬆️ Upload Files via FTP
        uses: SamKirkland/FTP-Deploy-Action@v4.3.4
        with:
          server: ${{ secrets.ftp_host }}
          username: ${{ secrets.ftp_user }}
          password: ${{ secrets.ftp_password }}
          local-dir: "./dist/"
          server-dir: "public_html/test/"

方案二：用Artifact传递构建产物（多Job场景） #

如果必须分开两个Job，比如需要不同的runner环境或依赖条件，可以用GitHub的Artifact功能在Job之间传递文件：

1. 修改build Job，添加上传构建产物的步骤 #

jobs:
  build:
    runs-on: ubuntu-latest
    strategy:
      matrix:
        node-version: [16.x]

    steps:
      - uses: actions/checkout@v3

      - name: Cache node modules
        uses: actions/cache@v1
        with:
          path: ~/.npm
          key: ${{ runner.os }}-node-${{ hashFiles('**/package-lock.json') }}
          restore-keys: |
            ${{ runner.os }}-node-

      - name: Node ${{ matrix.node-version }}
        uses: actions/setup-node@v1
        with:
          node-version: ${{ matrix.node-version }}

      - name: npm ci and npm run build
        run: |
          npm ci
          npm run build

      # 新增：把dist目录上传为Artifact
      - name: Upload build artifact
        uses: actions/upload-artifact@v3
        with:
          name: angular-dist
          path: ./dist/

2. 修改deploy Job，添加下载构建产物的步骤 #

deploy:
    name: 🚀 Deploy via FTP
    needs: [build]
    runs-on: ubuntu-latest
    steps:
      # 不用再checkout源码，直接下载之前上传的构建产物
      - name: Download build artifact
        uses: actions/download-artifact@v3
        with:
          name: angular-dist
          path: ./dist/ # 下载到当前目录的dist文件夹，保持路径一致

      - name: ⬆️ Upload Files
        uses: SamKirkland/FTP-Deploy-Action@v4.3.4
        with:
          server: ${{ secrets.ftp_host }}
          username: ${{ secrets.ftp_user }}
          password: ${{ secrets.ftp_password }}
          local-dir: "./dist/"
          server-dir: "public_html/test/"

• 优先选方案一，流程更短更不容易出错；
• 如果用方案二，要确保上传和下载的路径完全匹配；
• 确认你的Angular项目构建输出确实是./dist/，如果项目配置了自定义输出目录，要同步修改所有相关路径参数。

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