为何MERN应用部署Heroku成功后触发H10错误、返回503状态码

你遇到的报错核心是已废弃的node-sass包的环境兼容性问题，和你贴出的端口配置无关：

• node-sass依赖和操作系统、Node版本绑定的原生二进制包，你在Mac本地安装的是适配macOS架构的二进制文件，和Heroku的Linux 64位运行环境不兼容
• 如果Heroku自动匹配的Node runtime版本不在你安装的node-sass版本的支持范围内，也会直接触发该报错，进而导致应用启动失败，抛出H10错误码、503状态码
  问题确实和package.json配置相关，按以下优先级尝试解决方案即可：

方案一：替换node-sass为官方推荐的sass包（优先选择） #

node-sass已在2020年正式废弃，官方现在推荐使用纯JS实现的sass包，完全兼容原有语法，不存在任何跨环境兼容问题：

• 卸载原有依赖
  npm uninstall node-sass node-sass-middleware
• 安装替代依赖
  npm install sass sass-middleware
• 将项目中所有引入node-sass-middleware的代码替换为sass-middleware，用法完全一致，无需修改其他业务逻辑
• 提交代码重新部署即可

方案二：保留node-sass的适配方案 #

如果因历史项目原因暂时无法替换node-sass，修改package.json做以下配置：

• 明确指定Heroku使用的Node版本和你本地开发的Node版本完全一致，新增engines字段：

"engines": {
  "node": "你本地使用的Node版本，例如16.18.0"
}

• 新增postinstall钩子，强制Heroku在安装依赖时重新编译适配Linux环境的node-sass二进制包，修改scripts字段：

"scripts": {
  "start": "node ./bin/www",
  "postinstall": "npm rebuild node-sass",
  // 保留你原有其他scripts配置
}

• 提交修改重新部署即可

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