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！它奏效了！

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

那么你如何部署到Heroku呢？

2016年10月24日更新：

这是我在没有我提到的自定义buildpack的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

步骤：

使用npm run build -- --release
cd build
使用git init
使用git add .
使用git commit -m "Commit message"
使用heroku create my-apps-name-goes-here
推送至Heroku git push heroku master

瞧！

Answer 1

似乎反应入门工具包默认情况下不会作为生产运行，而buildpack sets the environment to production也不会。我相信您可以在项目中添加Procfile，告诉它从生产开始，或者只是set the Heroku environment to development。如果您在错误时发布Heroku日志，我们可以看到它的更多细节。

Answer 2

关于您的编辑 - 如果您希望从整个仓库进行部署，可以采用以下方式：

您必须向构建项目的postinstall添加package.json脚本（如果您将npm build -- --release放入Procfile中，它将被限制为30秒，之后Heroku将终止它 - 作为一个安装后的脚本，IIRC，15分钟执行）。

然后，只将web: node ./build/server.js放入Procfile中。

还要确保Heroku设置中的NPM_CONFIG_PRODUCTION设置为false，以便下载devDependencies。

以下是安装后脚本的示例：

import run from './run';

async function deployOnHeroku() {
  if (process.env.NODE_ENV == 'production') {
    process.argv.push('--release');
    await run(require('./build')); 
  }
}

export default deployOnHeroku;

将React Starter Kit（由Kriasoft）部署到Heroku

2 个答案: