GitHub Actions部署如何在复制文件前执行npm run build构建流程

原配置直接全量上传仓库所有文件到VPS，会把未压缩的测试源码、开发配置、测试文件等非生产内容同步到服务器，按以下方式调整即可，核心逻辑是在CI侧提前完成生产构建，仅上传运行必需的生产文件到服务器：

• 流程前置Node环境配置、依赖安装、生产构建步骤，在GitHub提供的运行器上完成产物打包，不需要把源码传到服务器再构建
• 收窄SCP同步的文件范围，仅上传构建产物和生产运行必需的配置文件，过滤源码、测试目录、开发依赖、Git配置等无关文件
• 修正原配置中SSH步骤的参数问题（appleboy/ssh-action的入参为全小写字段，原配置大写的USERNAME、PORT、PASSWORD字段无法被正确读取，会导致SSH认证失败），同时调整远程执行逻辑，跳过重复构建步骤，仅安装生产依赖、启动服务

调整后的完整配置 #

name: Deploy

# 建议限定仅推送到master分支时触发部署，避免其他分支推送误触发
on:
  push:
    branches: [ master ]

jobs:
  build:
    runs-on: ubuntu-latest

    steps:
    - name: 拉取仓库代码
      uses: actions/checkout@v4 # 旧版v1已停止维护，改用最新稳定版

    # 配置Node.js环境，版本和你本地生产环境使用的版本保持一致
    - name: 配置Node.js环境
      uses: actions/setup-node@v4
      with:
        node-version: 20 # 替换为项目实际使用的Node版本
        cache: 'npm'

    # 安装依赖并执行生产构建
    - name: 安装依赖&构建生产产物
      run: |
        npm ci
        npm run build

    # 仅同步生产必需文件到VPS，注意调整source路径匹配你项目的构建输出目录
    - name: 通过SCP同步生产文件到服务器
      uses: appleboy/scp-action@master
      with:
        host: ${{ secrets.HOST }}
        username: ${{ secrets.USERNAME }}
        port: ${{ secrets.PORT }}
        password: ${{ secrets.PASSWORD }}
        source: |
          dist/* # 替换为npm run build实际输出的构建目录，常见的还有build、out等
          package.json
          package-lock.json
        target: "/var/www/html/cnaiapp"
        rm: true # 同步前清空目标目录旧文件，避免残留文件干扰
        # 明确排除不需要同步的非生产文件
        exclude: |
          .git
          .github
          node_modules
          *.test.js
          src
          tests

    # 远程执行部署启动命令
    - name: 服务器端执行部署操作
      uses: appleboy/ssh-action@master # develop为开发分支，稳定性差，改用正式版
      with:
        host: ${{ secrets.HOST }}
        username: ${{ secrets.USERNAME }}
        port: ${{ secrets.PORT }}
        password: ${{ secrets.PASSWORD }}
        script: |
          cd /var/www/html/cnaiapp
          # 仅安装生产依赖，跳过开发依赖
          npm ci --production
          # 因CI侧已经完成构建，无需重复执行build，直接启动服务即可
          # 若保留原npm run deploy命令，请先删除命令内的build逻辑，避免服务器端因缺少源码构建失败
          npm run start

注意事项 #

• 请根据项目实际情况修改配置里的构建输出目录：如果npm run build的输出目录不是dist，把SCP步骤里的dist/*替换成实际目录名即可，比如React项目默认输出目录为build、Vue项目默认输出目录为dist
• 如果使用PM2等进程守护工具，可以把远程脚本里的启动命令替换为pm2 restart 你的服务名，实现服务平滑重启
• 旧版本的actions/checkout@v1和appleboy/ssh-action@develop存在已知兼容性问题，建议替换为配置中使用的稳定版本
• SCP同步的文件列表可以根据项目实际需求增减，只要保证生产运行必需的文件在列表内、源码和测试文件被排除即可

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