如何通过GitHub Action仅部署Vue项目dist目录文件到cPanel

• 名为my_web的Vue.js项目已通过GitHub Action部署到cPanel的public_html目录
• 现有部署逻辑会上传项目根目录下的全量文件，需要调整为仅上传构建生成的dist目录内的文件
• 原有工作流配置存在YAML缩进语法错误，且未指定FTP同步的本地源路径，原始配置如下：

on: 
  push:
   branches:
    - main
   name: 🚀 Deploy website on push
   jobs:
      web-deploy:
        name: 🎉 Deploy
        runs-on: ubuntu-latest
   steps:
- name: 🚚 Get latest code
      uses: actions/checkout@v2

- name: Use Node.js 14
     uses: actions/setup-node@v2
  with:
     node-version: '14'

- name: 🔨 Build Project
  run: |
    npm install
    npm run build    
- name: 📂 Sync files
  uses: SamKirkland/FTP-Deploy-Action@4.3.0
  with:
   server: ${{ secrets.FTP_SERVER }}
   username: ${{ secrets.FTP_USERNAME }}
   password: ${{ secrets.FTP_PASSWORD }}

1. 修正YAML层级缩进：YAML对缩进格式要求严格，原配置中steps块错位到了任务层级外，会直接导致工作流运行失败，需要将steps调整到web-deploy任务下，与任务的name、runs-on参数同级。
2. 给FTP部署动作添加local-dir参数，指定同步源为构建产物目录./dist/，参数值末尾必须携带斜杠，避免将dist文件夹本身上传到public_html目录导致访问路径异常。

on: 
  push:
    branches:
      - main
name: 🚀 Deploy website on push
jobs:
  web-deploy:
    name: 🎉 Deploy
    runs-on: ubuntu-latest
    steps:
      - name: 🚚 Get latest code
        uses: actions/checkout@v3

      - name: Use Node.js 14
        uses: actions/setup-node@v2
        with:
          node-version: '14'
  
      - name: 🔨 Build Project
        run: |
          npm install
          npm run build    

      - name: 📂 Sync files
        uses: SamKirkland/FTP-Deploy-Action@4.3.0
        with:
          server: ${{ secrets.FTP_SERVER }}
          username: ${{ secrets.FTP_USERNAME }}
          password: ${{ secrets.FTP_PASSWORD }}
          # 指定仅同步dist目录下的构建产物
          local-dir: ./dist/

补充说明：

• 如果部署后访问站点出现404，先确认FTP账号的根目录是否直接对应public_html：如果登录FTP后需要手动进入public_html目录才能看到站点文件，需要在FTP配置块中添加server-dir: ./public_html/参数指定远端部署目录。
• 如果使用Node.js 14构建时出现依赖兼容报错，可以将node版本调整为16或18，适配新版Vue构建工具的运行要求。

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