Javascript 如何将完整堆栈应用程序部署到heroku或netlify？哪些文件是必需的？

我有一个在本地主机上运行良好的全栈应用程序，但一旦部署到web（Heroku或netlify），该应用程序就会停止正常工作。我的问题是，为了后端正常工作，以及为了更新前端而继续使用API，我需要做哪些必要的更改。我已经尝试在express上更改端口：

const PORT = process.env.PORT || 5000;
app.listen(PORT, "0.0.0.0", err => {
  if (err) {
    console.error(err)
  } else {
    console.log(`Running on port ${PORT}`)

} })

---

我需要为端口添加自己的.env文件，还是heroku会自动添加？提前谢谢

如果您打算使用heroku，并且假设您已经设置了heroku帐户，并且已经安装并连接了heroku终端（如果您在那里遇到问题，请告诉我）

那么您需要以下内容：

Procfile-该文件告诉heroku要使用什么脚本来运行服务器。确保将其命名为

Procfile

，并且没有扩展名

它可以包含如下代码

web:warn heroku start

-注意这里我使用

warn

作为我的打包管理器，如果您使用的是

npm

，您可以轻松地将其替换为

。我还调用了
heroku start
，这是我的
package.json

下面是一个
pacakge.json
的示例（我只包括重要的行）

我正在使用

babel

构建我的项目。请不要被我拥有的大量脚本弄得不知所措，有些脚本是无用的。但是，您应该注意脚本下的这一行

“heroku start”：“node dist”

——这是我在heroku上运行应用程序的脚本。你可以说类似于

node index.js

我正在使用

dist

，因为巴贝尔正在构建我的应用程序，使其能够与旧的ecma版本一起使用，同时允许我使用新的ecma版本，脚本

build

就是生成我的dist文件夹的原因

我还附上了我的个人资料，以防你感兴趣

您还需要

app.json

-此文件基本上描述了您对heroku的应用程序

这是一个样本

{
  "name":"myApp",
  "description":"my cool app",
  "repository":"https://github.com/mycoolapp/",
  "logo":"http://node-js-sample.herokuapp.com/node.svg",
  "keywords":["node","express","anothertag"],
  "image":"heroku/nodejs"
}

完成后，您可以将项目上传到heroku，它应该可以正常运行。您可以在heroku和github上的主分支之间设置一个钩子，以便在推送到maser或合并到maser时自动部署

下一步：

我注意到你的代码中有一些不对劲的地方，我不建议在heroku上使用

0.0.0

，这里有一些解释

这是你的新代码

const PORT = process.env.PORT || 5000;
app.listen(PORT, function(err) {
  if (err) {
    console.error(err)
  } else {
    console.log(`Running on port ${PORT}`)
}
}

另外，不要使用箭头函数，因为某些浏览器和heroku可能无法正确构建它（这就是我使用babel的原因）

最后，这是一个关于在heroku上创建nodejs应用程序的好教程

---

祝你好运。

如果你要使用netlify，你只能托管静态文件，这意味着如果你要这样做，你可能需要从前端代码分离后端 在heroku中托管后端 你在netlify的前端呢

---

此外，如果要在同一台服务器上使用后端构建react，您还需要一个procfile来告诉heroku如何处理您的应用程序。希望这能帮助那些想了解netlify/heroku部署的人

您有procfile吗@内森：不，我不知道，我还在学习希罗库的怪癖。我只是在我的根目录中添加了一个“Procfile.txt”文件吗？谢谢你这么详细的解释！那么，我应该向根目录添加一个Procfile和一个app.json文件吗？行！嘿，你能告诉我我的package.json文件是否正确吗？我对react脚本以及它们是否会干扰heroku感到困惑：

{“name”：“react chat tutorial”，“version”：“0.1.0”，“private”：true，“dependencies”：{“@pusher/chatkit client”：“^1.0.2”，“@pusher/chatkit server”：“^1.0.1”，“cors”：“^2.8.4”，“express”：“^4.16.3”，“lodash”：“^4.17.15”，“lodash.template”：“^4.5.0”、“react”：“^16.2.0”、“react dom”：“^16.2.0”、“react scripts”：“1.1.1”；“devdependences”：“{”并发“；“^3.5.1”

”脚本“{”启动“：“并发”；“node./server.js”“react scripts start”；“heroku postbuild”：“cd客户端和npm安装及npm运行构建”，”heroku start:“node index.js”，“build:“react scripts build”，“test:“react scripts test--env=jsdom”，“eject:“react scripts eject”}

const PORT = process.env.PORT || 5000;
app.listen(PORT, function(err) {
  if (err) {
    console.error(err)
  } else {
    console.log(`Running on port ${PORT}`)
}
}