使用 Travis CI 运行后，如何将 Node Express 和 React 应用程序部署到 Heroku？答案

【问题标题】：How can I deploy a Node Express and React app to Heroku, after running with Travis CI?使用 Travis CI 运行后，如何将 Node Express 和 React 应用程序部署到 Heroku？
【发布时间】：2018-09-25 09:15:21
【问题描述】：

以下设置：

Node Express 服务器，在 localhost:5000 上运行。
直接在服务器文件夹中使用create-react-app 创建的客户端文件夹。
CI 与 Travis CI 的集成

我想在应用通过时将其部署到 heroku。因此我创建了以下.travis.yml：

language: node_js
before_install: 
  - npm install && node index.js &
before_script: cd ./client && npm install
node_js:
  - "stable"
cache:
  directories:
  - node_modules
script:
  - npm run test
  - npm run lint
  - npm run build
notifications:
    slack: clicker-web:myslack
deploy:
  provider: heroku
  api_key: "mykey"
  app: test999111test
  on: heroku-deployment-testing

所以我把它部署到 heroku 并且没有在 travis 上失败。但是在 heroku 应用程序本身中，我只是收到错误消息（在控制台中）：

npm ERR! code ELIFECYCLE
2018-04-15T15:15:31.033343+00:00 app[web.1]: npm ERR! errno 1
2018-04-15T15:15:31.034412+00:00 app[web.1]: npm ERR! Clicker@0.1.0 start: `node scripts/start.js`
2018-04-15T15:15:31.034622+00:00 app[web.1]: npm ERR! Exit status 1
2018-04-15T15:15:31.034841+00:00 app[web.1]: npm ERR! 
2018-04-15T15:15:31.035019+00:00 app[web.1]: npm ERR! Failed at the Clicker@0.1.0 start script.

所以我很确定我的设置一定有问题。

这是我在服务器（根）目录中设置的package.json（只是你需要的一段代码）：

"engines": {
    "node": "8.1.1",
    "npm": "5.0.3"
  },
  "scripts": {
    "client": "npm start --prefix client",
    "buildclient": "npm build --prefix client",
    "server": "nodemon index.js",
    "dev":
      "concurrently --kill-others-on-fail \"npm run server\" \"npm run client\"",
    "build": "concurrently \"npm run server\" \"npm run client\"",
    "test": "npm run server",
    "start": "node index.js",
    "heroku-postbuild":
      "npm run install --prefix client && npm run build --prefix client"

我在我的应用程序中使用代理进行开发，它工作得很好。但是在 heroku 上我不需要它。我在index.js（在服务器根目录）中创建了这些行：

const path = require("path");
app.get("*", (req, res) => {
  res.sendFile(path.resolve(__dirname, "client", "build", "index.html"));
});

但我总是从 Heroku 收到同样的错误。我做错了什么以及如何通过最佳实践将服务器+客户端结合到 Travis 的 Heroku 部署？

这是项目，您可以在其中看到文件结构。我现在在heroku-deployment-testing 分支上。

Github Repo

这里还有 herokuapp，除了错误之外什么也没显示：

Heroku App

最后但并非最不重要的 travis 日志（部署的最后一部分）：

【问题讨论】：

现在您已经公开分享了它，您需要撤销您的 Heroku API 密钥。另请注意，SO 不支持 GitHub 风格的降价。
完成，谢谢提供信息！好的，我的降价有什么问题？你觉得是不是太长了？我用你看到“在此处粘贴代码”的代码标签进行了尝试，但它真的把它搞砸了
你没有阅读editing help。
您还需要撤销您的 mlab 凭据和 Google 密码。不要将您的 .env 提交到公共存储库。
该死的。会做。谢谢

标签： node.js express heroku deployment travis-ci

【解决方案1】：

尝试使用这个配置

language: node_js
node_js:
- '8'
cache:
  directories:
  - node_modules
  - client/node_modules
install:
- npm install
- npm run build
script:
- nohup npm run start &
- sleep 3
- npm run test
- npm run lint
deploy:
  provider: heroku
  api_key:
    secure: API_KEY
  app: YOUR_APP_NAME

我相信您不需要 before_install 和 before_script 部分。

而且您也不需要运行npm run build 脚本，因为您在 package.json 中使用“heroku_postbuild”脚本构建应用程序。

【讨论】：