Angular应用部署至Elastic Beanstalk失败求助

针对两种部署方式的修复方案 #

方式一：EB CLI部署 #

• 执行eb init时，确认选择的Node.js平台版本与本地Angular项目兼容（比如Angular 16+对应Node 18.x及以上）
• 在项目根目录创建.platform/nginx/conf.d/elasticbeanstalk/00_application.conf文件，配置Nginx指向Angular静态文件目录：

  location / {
      root /var/app/current/dist/[你的Angular项目名称];
      try_files $uri $uri/ /index.html;
  }
  

• 运行ng build --configuration=production确认dist目录生成正常，再执行eb deploy

方式二：控制台上传压缩包 #

• 构建完成后，进入dist/[你的Angular项目名称]目录，压缩目录内所有文件（不要直接压缩dist文件夹）
• 压缩包中必须包含上述.platform配置文件夹，否则EBS无法正确识别静态文件路径
• 上传前确认EBS环境的Node.js平台版本与项目兼容

通用排查步骤 #

• 查看EBS完整日志：控制台进入对应环境 → 日志 → 请求完整日志，搜索关键词如404、Node version、file not found定位具体错误
• 检查angular.json中build配置的outputPath是否为dist/[项目名]，确保构建输出路径正确
• 若用Node.js托管静态文件，可在项目根目录添加server.js：

  const express = require('express');
  const path = require('path');
  const app = express();
  
  app.use(express.static(path.join(__dirname, 'dist/[你的项目名]')));
  app.get('/*', (req, res) => {
    res.sendFile(path.join(__dirname, 'dist/[你的项目名]/index.html'));
  });
  
  app.listen(process.env.PORT || 8080);
  

  同时在package.json添加启动脚本"start": "node server.js"，并安装依赖npm install express --save

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