如何配置AWS ElasticBeanstalk执行React前端项目的npm构建？

• 前端脚本触发逻辑完全断链
  • 你在package.json中配置的prestart、start脚本，仅在主动执行npm start命令时才会按顺序触发：先执行prestart关联的npm install完成依赖安装，再执行start关联的webpack生产打包。当前部署环境没有任何环节主动调用npm start命令，自然不会执行依赖安装和打包流程。
  • 常见漏配场景：Flask后端的启动入口（无论是flask run调试模式、gunicorn/uwsgi生产启动模式）没有集成前端构建的触发逻辑，前端构建环节和后端启动流程完全脱节，拉取完代码就直接启动后端服务，跳过了整个前端构建步骤。
• 环境变量的生效范围配置错误
  • 在AWS实例上设置的NPM_USE_PRODUCTION=true如果是通过命令行临时export配置的，仅对当前终端会话生效，后续通过systemd、PM2、自动部署服务启动的进程无法读取到这个临时变量，必须将变量写入项目目录下的.npmrc文件、或者对应服务的启动环境配置中才能真正生效。
  • 注意：该参数仅控制npm install时是否自动跳过devDependencies的安装，本身没有触发依赖安装、打包流程的能力，当前配置相当于只提前设定了依赖安装的规则，没有实际启动安装和打包动作。
• 生产打包的依赖完整性漏配
  • 因为设置了NPM_USE_PRODUCTION=true，npm install时会自动跳过devDependencies的安装，但目前如果webpack、webpack-cli、React相关构建工具都配置在devDependencies字段中，后续就算触发了安装和打包流程，也会因为命令不存在、模块找不到的报错中断，无法生成有效bundle。需要将生产构建必需的工具包迁移到dependencies字段中匹配生产环境的安装规则。
• 部署流程的钩子环节缺失
  • 如果使用AWS CodeDeploy、第三方CI工具完成自动上线，需要确认部署配置文件（例如CodeDeploy的appspec.yml）中没有配置拉取代码后执行前端构建的步骤，当前部署流程拉取完代码就直接进入后端启动环节，完全跳过了前端构建的全流程。

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