React应用GitHub Actions CI/CD构建阶段编译失败报错

错误分析 #

构建阶段抛出的核心错误是Cannot find module '@babel/plugin-proposal-private-property-in-object'，根源在于你在依赖安装步骤使用了npm ci --production命令：

• --production参数会让npm仅安装package.json中的dependencies字段，忽略devDependencies
• React项目构建所需的Babel插件（包括缺失的这个）都属于开发依赖，因此构建时无法找到对应模块

解决方案 #

1. 修正依赖安装命令 #

将npm ci --production改为npm ci，该命令会严格按照package-lock.json安装所有依赖（包括开发依赖），完全适配CI环境的构建需求。

2. （可选）更新GitHub Actions插件版本 #

建议将旧版的Actions插件更新至稳定版，提升流程可靠性：

• actions/checkout@v2 → actions/checkout@v4
• aws-actions/configure-aws-credentials@v1 → aws-actions/configure-aws-credentials@v4

修改后的GitHub Actions配置 #

name: Build and Deploy React App to CloudFront

on:
  push:
    branches:
      - master
  fork: []

env:
  ACTIONS_ALLOW_UNSECURE_COMMANDS: true
  BUCKET: www.tejasportofolio.com
  DIST: build
  REGION: ap-south-1
  DIST_ID: OOOOOOOOOOOOO

jobs:
  build-and-deploy:
    name: Build and Deploy
    runs-on: ubuntu-latest
    steps:
      - name: Checkout
        uses: actions/checkout@v4

      - name: Configure AWS Credentials
        uses: aws-actions/configure-aws-credentials@v4
        with:
          aws-access-key-id: ${{ secrets.AWS_ACCESS_KEY_ID }}
          aws-secret-access-key: ${{ secrets.AWS_SECRET_ACCESS_KEY }}
          aws-region: ${{ env.REGION }}

      - name: Install Dependencies
        run: |
          node --version
          npm ci

      - name: Build Static Website
        run: npm run build

      - name: Copy files to the production website with the AWS CLI
        run: |
          aws s3 sync --delete ${{ env.DIST }} s3://${{ env.BUCKET }}

      - name: Create CloudFront Invalidation
        run: |
          aws cloudfront create-invalidation \
            --distribution-id ${{ env.DIST_ID }} \
            --paths "/*"

额外说明 #

如果出于某种原因必须保留--production参数，你可以手动将@babel/plugin-proposal-private-property-in-object添加到package.json的dependencies字段中，但这不符合依赖分类的最佳实践，仅作为临时 workaround 建议。

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