部署Angular Universal到Heroku失败：Node.js应用编译出错

你遇到的核心问题集中在JSON语法错误、Node版本未指定，再加上一些部署配置细节的疏漏，下面一步步帮你排查解决：

1. 修复package.json的JSON语法错误 #

Heroku日志里的npm ERR! Unexpected token < in JSON at position 108，本质是你的package.json格式不合法。看你提供的代码，devDependencies最后一项"request"没有对应的版本号，这违反了JSON键值对的规范：

"devDependencies": {
    // ... 其他依赖项
    "request" // 这里错误：缺少版本号，且语法不完整
}

解决方式二选一：

• 如果你确实需要request包，补充上版本号，比如"request": "^2.88.2"
• 不需要的话直接删掉这一行
• 同时检查所有依赖项的逗号是否正确，确保整个JSON结构没有语法问题

2. 指定Node.js和npm版本 #

Heroku提示你package.json中未指定Node版本，这会导致它使用默认版本，很可能和你的Angular 5项目不兼容。在package.json的根节点添加engines字段，选择Angular 5支持的版本（Angular 5要求Node 6.9.0+，推荐用14.x版本，兼容性更稳定）：

"engines": {
  "node": "14.x",
  "npm": "6.x"
}

3. 调整依赖项的归属 #

你在postinstall脚本里用到了ng build和babel-cli这些工具，它们原本在devDependencies里，但Heroku默认会跳过devDependencies的安装，所以必须把这些生产环境需要的工具移到dependencies里：

• 将@angular/cli、@angular/compiler-cli、babel-cli、babel-preset-es2015从devDependencies移到dependencies
• 也可以在Heroku设置环境变量NPM_CONFIG_PRODUCTION=false强制安装所有依赖，但前者是更规范的做法

4. 修正部署的细节配置 #

• 不要提交node_modules文件夹：Heroku会自动安装依赖，提交这个文件夹不仅会增大仓库体积，还可能引发依赖冲突。执行以下命令清理：

  git rm -r --cached node_modules
  echo "node_modules/" >> .gitignore
  git add .gitignore
  git commit -m "Add node_modules to gitignore"
  

• 确认Procfile内容：Procfile要放在项目根目录，内容必须是：

  web: npm start
  

  同时确保你的start脚本node index.js指向的Angular Universal服务器入口文件配置正确（比如正确引入了Express和Universal引擎）。

5. 重新尝试部署 #

完成以上修改后，重新执行部署命令：

git add .
git commit -m "Fix deployment configuration issues"
git push heroku master

如果还是有问题，可以通过以下命令查看实时日志定位具体错误：

heroku logs --tail

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