node.js - 将 React Starter Kit(由 Kriasoft 提供)部署到 Heroku

Question

我一直在尝试将在 https://github.com/kriasoft/react-starter-kit 上找到的 React Starter Kit 的原始演示部署到 Heroku，直到现在才成功。

我所做的只是克隆存储库，然后使用 heroku create 和 git push heroku master 进行部署。但是每次我打开现在由 Heroku 托管的应用程序时，它都会显示应用程序错误。我也试过 npm run deploy 无济于事。

然后我在这里找到了一个 React Starter Kit buildpack:https://github.com/angelhive/react-starter-kit-buildpack 并使用它代替了官方的 Node.js buildpack 和 BAM !成功了!

我的问题是:这个自定义构建包在 GitHub 上的星数为零，所以我认为大多数使用 React Starter Kit 的人都不会使用它。

那么如何部署到 Heroku？

---

2016 年 10 月 24 日更新:

这是我在没有我提到的自定义构建包的 React Starter Kit 应用程序上运行 heroku logs 后得到的错误日志。 NODE_ENV 设置为 production，dynos 正确运行 web: npm start 命令。

2016-10-24T16:58:59.080046+00:00 heroku[api]: Enable Logplex by XXXXXXXXXXX
2016-10-24T16:58:59.080092+00:00 heroku[api]: Release v2 created by XXXXXXXXXXX
2016-10-24T17:00:10.139875+00:00 heroku[api]: Set NODE_ENV config vars by XXXXXXXXXXX
2016-10-24T17:00:10.139974+00:00 heroku[api]: Release v3 created by XXXXXXXXXXX
2016-10-24T17:00:35.563970+00:00 heroku[api]: Scaled to web@1:Free by XXXXXXXXXXX
2016-10-24T17:00:35.567139+00:00 heroku[api]: Deploy 048e67f by XXXXXXXXXXX
2016-10-24T17:00:35.567139+00:00 heroku[api]: Release v4 created by XXXXXXXXXXX
2016-10-24T17:00:36.222028+00:00 heroku[slug-compiler]: Slug compilation started
2016-10-24T17:00:36.222047+00:00 heroku[slug-compiler]: Slug compilation finished
2016-10-24T17:00:38.552446+00:00 heroku[web.1]: Starting process with command `npm start`
2016-10-24T17:00:42.185504+00:00 app[web.1]: 
2016-10-24T17:00:42.185533+00:00 app[web.1]: > @ start /app
2016-10-24T17:00:42.185534+00:00 app[web.1]: > babel-node tools/run start
2016-10-24T17:00:42.185535+00:00 app[web.1]: 
2016-10-24T17:00:42.192826+00:00 app[web.1]: sh: 1: babel-node: not found
2016-10-24T17:00:42.200552+00:00 app[web.1]: 
2016-10-24T17:00:42.210421+00:00 app[web.1]: npm ERR! Linux 3.13.0-100-generic
2016-10-24T17:00:42.210728+00:00 app[web.1]: npm ERR! argv "/app/.heroku/node/bin/node" "/app/.heroku/node/bin/npm" "start"
2016-10-24T17:00:42.210968+00:00 app[web.1]: npm ERR! node v5.11.1
2016-10-24T17:00:42.211330+00:00 app[web.1]: npm ERR! file sh
2016-10-24T17:00:42.211141+00:00 app[web.1]: npm ERR! npm  v3.10.9
2016-10-24T17:00:42.211525+00:00 app[web.1]: npm ERR! code ELIFECYCLE
2016-10-24T17:00:42.211735+00:00 app[web.1]: npm ERR! errno ENOENT
2016-10-24T17:00:42.212382+00:00 app[web.1]: npm ERR! syscall spawn
2016-10-24T17:00:42.212551+00:00 app[web.1]: npm ERR! @ start: `babel-node tools/run start`
2016-10-24T17:00:42.212706+00:00 app[web.1]: npm ERR! spawn ENOENT
2016-10-24T17:00:42.212849+00:00 app[web.1]: npm ERR! 
2016-10-24T17:00:42.212995+00:00 app[web.1]: npm ERR! Failed at the @ start script 'babel-node tools/run start'.
2016-10-24T17:00:42.213144+00:00 app[web.1]: npm ERR! Make sure you have the latest version of node.js and npm installed.
2016-10-24T17:00:42.213569+00:00 app[web.1]: npm ERR! Tell the author that this fails on your system:
2016-10-24T17:00:42.213288+00:00 app[web.1]: npm ERR! If you do, this is most likely a problem with the  package,
2016-10-24T17:00:42.213424+00:00 app[web.1]: npm ERR! not with npm itself.
2016-10-24T17:00:42.213724+00:00 app[web.1]: npm ERR!     babel-node tools/run start
2016-10-24T17:00:42.213831+00:00 app[web.1]: npm ERR! You can get information on how to open an issue for this project with:
2016-10-24T17:00:42.214003+00:00 app[web.1]: npm ERR!     npm bugs 
2016-10-24T17:00:42.214094+00:00 app[web.1]: npm ERR! Or if that isn't available, you can get their info via:
2016-10-24T17:00:42.214241+00:00 app[web.1]: npm ERR!     npm owner ls 
2016-10-24T17:00:42.214386+00:00 app[web.1]: npm ERR! There is likely additional logging output above.
2016-10-24T17:00:42.220413+00:00 app[web.1]: 
2016-10-24T17:00:42.220613+00:00 app[web.1]: npm ERR! Please include the following file with any support request:
2016-10-24T17:00:42.220727+00:00 app[web.1]: npm ERR!     /app/npm-debug.log
2016-10-24T17:00:42.305908+00:00 heroku[web.1]: State changed from starting to crashed
2016-10-24T17:00:42.306806+00:00 heroku[web.1]: State changed from crashed to starting
2016-10-24T17:00:42.287610+00:00 heroku[web.1]: Process exited with status 1
2016-10-24T17:00:44.933721+00:00 heroku[web.1]: Starting process with command `npm start`
2016-10-24T17:00:49.345711+00:00 app[web.1]: 
2016-10-24T17:00:49.345725+00:00 app[web.1]: > @ start /app
2016-10-24T17:00:49.345726+00:00 app[web.1]: > babel-node tools/run start
2016-10-24T17:00:49.345726+00:00 app[web.1]: 
2016-10-24T17:00:49.354255+00:00 app[web.1]: sh: 1: babel-node: not found
2016-10-24T17:00:49.361940+00:00 app[web.1]: 
2016-10-24T17:00:49.372282+00:00 app[web.1]: npm ERR! Linux 3.13.0-100-generic
2016-10-24T17:00:49.372554+00:00 app[web.1]: npm ERR! argv "/app/.heroku/node/bin/node" "/app/.heroku/node/bin/npm" "start"
2016-10-24T17:00:49.372733+00:00 app[web.1]: npm ERR! node v5.11.1
2016-10-24T17:00:49.372926+00:00 app[web.1]: npm ERR! npm  v3.10.9
2016-10-24T17:00:49.373115+00:00 app[web.1]: npm ERR! file sh
2016-10-24T17:00:49.373304+00:00 app[web.1]: npm ERR! code ELIFECYCLE
2016-10-24T17:00:49.373492+00:00 app[web.1]: npm ERR! errno ENOENT
2016-10-24T17:00:49.373868+00:00 app[web.1]: npm ERR! @ start: `babel-node tools/run start`
2016-10-24T17:00:49.373697+00:00 app[web.1]: npm ERR! syscall spawn
2016-10-24T17:00:49.374022+00:00 app[web.1]: npm ERR! spawn ENOENT
2016-10-24T17:00:49.374201+00:00 app[web.1]: npm ERR! 
2016-10-24T17:00:49.374376+00:00 app[web.1]: npm ERR! Failed at the @ start script 'babel-node tools/run start'.
2016-10-24T17:00:49.374678+00:00 app[web.1]: npm ERR! If you do, this is most likely a problem with the  package,
2016-10-24T17:00:49.374528+00:00 app[web.1]: npm ERR! Make sure you have the latest version of node.js and npm installed.
2016-10-24T17:00:49.374822+00:00 app[web.1]: npm ERR! not with npm itself.
2016-10-24T17:00:49.374977+00:00 app[web.1]: npm ERR! Tell the author that this fails on your system:
2016-10-24T17:00:49.375126+00:00 app[web.1]: npm ERR!     babel-node tools/run start
2016-10-24T17:00:49.375284+00:00 app[web.1]: npm ERR! You can get information on how to open an issue for this project with:
2016-10-24T17:00:49.375746+00:00 app[web.1]: npm ERR!     npm owner ls 
2016-10-24T17:00:49.375448+00:00 app[web.1]: npm ERR!     npm bugs 
2016-10-24T17:00:49.375600+00:00 app[web.1]: npm ERR! Or if that isn't available, you can get their info via:
2016-10-24T17:00:49.381159+00:00 app[web.1]: 
2016-10-24T17:00:49.375892+00:00 app[web.1]: npm ERR! There is likely additional logging output above.
2016-10-24T17:00:49.381402+00:00 app[web.1]: npm ERR! Please include the following file with any support request:
2016-10-24T17:00:49.381546+00:00 app[web.1]: npm ERR!     /app/npm-debug.log
2016-10-24T17:00:49.475744+00:00 heroku[web.1]: Process exited with status 1
2016-10-24T17:00:49.480202+00:00 heroku[web.1]: State changed from starting to crashed
2016-10-24T17:00:49.926683+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=heroku-dev-antony.herokuapp.com request_id=4610f6f7-68bc-4cbc-94c2-bdaf052f1dce fwd="86.132.224.74" dyno= connect= service= status=503 bytes=
2016-10-24T17:00:50.897033+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=heroku-dev-antony.herokuapp.com request_id=55c2a40c-6baa-4315-8b3e-2dc9d01c469c fwd="86.132.224.74" dyno= connect= service= status=503 bytes=

---

2016 年 10 月 25 日更新

好吧，事实证明这是一个简单的初学者错误。我基本上将整个套件(包括 ./src 和 ./test)部署到 Heroku，而不是仅部署 ./build 文件夹。

以下是将生产 React Starter Kit 应用程序部署到 Heroku 的步骤:

要求:

• 拥有一个 Heroku 帐户
• 按照此处概述的步骤操作:https://devcenter.heroku.com/articles/heroku-command-line

步骤:

1. 使用 npm run build -- --release 构建生产就绪应用程序
2. cd 构建
3. 使用 git init 初始化一个 git 仓库
4. 使用 git add 添加所有内容。
5. 使用 git commit -m "Commit message" 提交您的更改
6. 使用 heroku create my-apps-name-goes-here 创建一个 Heroku 应用程序
7. 推送到 Heroku git push heroku master

瞧!

Answer 1

默认情况下，react starter kit 似乎没有作为生产运行，buildpack sets the environment to production .我相信您可以添加 Procfile告诉项目开始生产或简单地 set the Heroku environment to development .如果您在出错时发布 Heroku 日志，我们可以看到更多详细信息。