Angular应用部署至Heroku时崩溃，寻求修复方案

问题根源 #

从Heroku日志能明确两个关键问题：

• 启动命令使用ng serve：这是Angular的开发热重载服务器，会保留大量调试资源、实时编译代码，内存占用极高，直接导致Heroku免费dyno内存耗尽（日志中FATAL ERROR: Reached heap limit Allocation failed - JavaScript heap out of memory就是内存溢出的明确标识）。
• 未使用生产级静态服务器：虽然配置了heroku-postbuild执行生产构建，但启动时没有用轻量服务器托管构建后的静态文件。

修复步骤 #

1. 安装静态文件服务器 #

安装serve（轻量、低内存的静态文件服务器）：

npm install --save-dev serve

2. 修改package.json的启动脚本 #

将start命令替换为用serve托管Angular生产构建后的产物（默认输出到dist/client目录）：

{
  "scripts": {
    "ng": "ng",
    "start": "serve -s dist/client",
    "watch": "ng build --watch --configuration development",
    "test": "ng test",
    "heroku-postbuild": "ng build --prod"
  }
}

3. （可选）解决构建阶段内存溢出 #

如果heroku-postbuild执行时也出现内存不足，给Node增加内存限制：

"heroku-postbuild": "NODE_OPTIONS=--max_old_space_size=4096 ng build --prod"

4. 重新部署 #

提交修改并推送到Heroku：

git add package.json package-lock.json
git commit -m "fix: 替换生产服务器为serve，修复内存溢出"
git push heroku main

为什么这样有效 #

• ng serve仅适用于本地开发，内存占用远高于生产环境需求；serve专注于静态资源托管，内存消耗极低，完美适配Heroku免费dyno的512MB内存限制。
• Angular生产构建后的dist目录包含压缩后的静态文件，用serve托管是生产环境的标准做法。

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