将 MEAN 堆栈应用程序部署到 Heroku 而不加载任何文件？答案

【问题标题】：Deploying a MEAN stack app to Heroku not loading any files?将 MEAN 堆栈应用程序部署到 Heroku 而不加载任何文件？
【发布时间】：2019-09-09 08:02:53
【问题描述】：

我正在设置我的网络应用程序以部署到 Heroku。构建成功，但没有加载任何文件，我遇到一个空白页面和一个无法 GET/ 错误消息。

我已经尝试了以下两种指南/解决方案，但都没有发现任何一种方法。 https://medium.com/@BaaniLeen/deploying-mean-stack-app-to-heroku-tips-and-tricks-5bd43a967f8c

https://devcenter.heroku.com/articles/mean-apps-restful-api

我尝试更改我的 PROCFILE、Server.js 和 /bin/www.js 文件以尝试让 heroku 实际加载事物的角度方面，但无济于事。

https://www.github.com/jaredana/crud 有一个指向 repo 的链接，它与我的本地文件是最新的，所以文件结构几乎相同减去我的 .gitignores

这是我上一个“heroku logs --tail”https://imgur.com/btdp0sE的图片

我还在我的 app.js 文件中包含了这些行（其中声明了 express()）：

var distDir = __dirname + "/dist/";
app.use(express.static(distDir));

因为我知道运行 ng build 时，它会将您的 Angular 应用程序构建到 /dist/ 目录中。

所有这些都可以在我的本地机器上运行。我在通常运行ng serve --proxy-config proxy.config.json 的角度端运行npm start，我在调用node ./bin/www 的节点端运行npm start。我将它们设置为 node ./node/server.js 用于角端“启动”脚本和 node ./node/bin/www 在节点端“启动”脚本以及包含web: npm start 的 procfile

我显然需要在部署应用程序时更改 heroku 正在运行的内容，以便不仅初始化节点端。但是我很难澄清什么需要由 heroku 加载，什么不需要

如果需要更多信息或更多图片，我很乐意提供，因为我似乎不太容易找到答案。感谢您的宝贵时间。

【问题讨论】：

标签： node.js angular express heroku

【解决方案1】：

我不确定您实际使用了哪些文件，因为您的 repo 与您在此处编写的不同。

如果您在其中写入“npm start”，则不需要 Procfile，如果您没有 Procfile，heroku 将使用 npm start。所以在Procfile中编写正确的启动命令，如：

web: node ./node/server.js"

然后您可以为您的开发机器使用“npm start”。

明显的错误是您的 dist 文件夹的路径，因为 express-server 是根据日志启动的。如果您使用我们在日志中看到的命令启动您的快速服务器：

node ./node/server.js"

您需要像“../dist/”这样的路径，因为您在节点文件夹中启动了 express-server，并且您需要从中退出，因为 dist 文件夹将位于同一级别作为节点文件夹。

var distDir = "../dist/";
app.use(express.static(distDir));

另一个问题可能是安装后脚本。此脚本将在 heroku 上的 npm install 之后运行，但在 npm run build 之前运行。将 postinstall 替换为 heroku-postbuild。这将替换 heroku 上的“npm build”。

"postinstall": "ng build --output-path dist --prod" // replace that line with the next
"heroku-postbuild": "ng build --output-path dist --prod"

【讨论】：