使用 npm install 后,React 应用程序在 Heroku 上崩溃
React app crashes on Heroku after using npm install
每当我 npm 安装任何模块时,我的 ReactJS 应用程序总是崩溃。
您可以通过在终端上执行此操作来重现该问题。
create-react-app [项目名称]
cd [项目名称]
git 初始化
heroku git:remote -a [heroku 应用的名称]
git 添加 .
git commit -m "init"
git 推送 heroku 大师
您会发现一切正常,但稍后再试。
npm 安装反应-dom
(或任何 package/modules。使用 --save 也会产生相同的错误)
git 添加-u
git commit -m "new module"
git 推送 heroku 大师
应用程序会在服务器上崩溃,我不知道为什么。
注意:在这种情况下,react-dom 已经由 create-react-app 安装,所以 npm 只更新它。尽管如此,它还是崩溃了。您可以安装一个新模块,它的行为仍然相同。
根据要求,这是错误日志。
2017-06-30T20:12:46.778184+00:00 app[web.1]: npm ERR! spawn ENOENT
2017-06-30T20:12:46.778396+00:00 app[web.1]: npm ERR!
2017-06-30T20:12:46.778645+00:00 app[web.1]: npm ERR! Failed at the 007-test@0.1.0 start script.
2017-06-30T20:12:46.779136+00:00 app[web.1]: npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
2017-06-30T20:12:46.780482+00:00 app[web.1]:
2017-06-30T20:12:46.780763+00:00 app[web.1]: npm ERR! A complete log of this run can be found in:
2017-06-30T20:12:46.780934+00:00 app[web.1]: npm ERR! /app/.npm/_logs/2017-06-30T20_12_46_768Z-debug.log
2017-06-30T20:12:46.920375+00:00 heroku[web.1]: State changed from starting to crashed
2017-06-30T20:12:46.903436+00:00 heroku[web.1]: Process exited with status 1
2017-06-30T21:01:33.667285+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=react-app-007.herokuapp.com request_id=d4936b9c-4c21-4ce4-862c-8b05da3bc005 fwd="64.62.224.29" dyno= connect= service= status=503 bytes= protocol=https
2017-06-30T21:01:35.111452+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=react-app-007.herokuapp.com request_id=cef9f3f8-a46b-4760-9c24-de59ba540e2e fwd="64.62.224.29" dyno= connect= service= status=503 bytes= protocol=https
This sequence of commands should do the trick:
npm install -g create-react-app
create-react-app my-app
cd my-app
git init
heroku create -b https://github.com/mars/create-react-app-buildpack.git
git add .
git commit -m "react-create-app on Heroku"
git push heroku master
heroku open
我认为添加 React (-b https://github.com/mars/create-react-app-buildpack.git
) 的自定义构建包是您所缺少的。在 Heroku 项目仪表板的设置选项卡下,您可以将构建包添加到现有项目中。
-b
标志是 --buildpack
的缩写
$ heroku help create
Usage: heroku create [APP] [flags]
creates a new app
Flags:
-b, --buildpack buildpack url to use for this app
-n, --no-remote do not create a git remote
-o, --org organization to use
-r, --remote the git remote to create, default "heroku"
-s, --stack the stack to create the app on
-t, --team team to use
--addons comma-delimited list of addons to install
--region specify region for the app to run in
--space the private space to create the app in
--ssh-git use SSH git protocol for local git remote
这是我电脑上的 heroku cli 版本:
$ heroku --version
heroku-cli/6.12.0-a504409 (darwin-x64) node-v7.10.0
有关 buildpacks
命令的特定信息:
$ heroku help buildpacks
Usage: heroku buildpacks [flags]
display the buildpack_url(s) for an app
Flags:
-a, --app (required) app to run command against
-r, --remote git remote of app to use
Examples:
$ heroku buildpacks
heroku buildpacks commands: (get help with heroku help buildpacks:COMMAND)
buildpacks display the buildpack_url(s) for an app
buildpacks:add URL add new app buildpack, inserting into list of buildpacks if necessary
buildpacks:clear clear all buildpacks set on the app
buildpacks:remove [URL] remove a buildpack set on the app
buildpacks:set URL set new app buildpack, overwriting into list of buildpacks if necessary
您可以 运行 heroku buildpacks:add https://github.com/mars/create-react-app-buildpack.git
而不是通过 Web 仪表板添加该构建包。
经过一番调试,我找到了根本错误。当我 npm 安装一个包时,它弄乱了构建。模块 react-scripts 不再工作了。
我将其从 devDependencies 移至 package.json 中的依赖项,删除了我的节点模块、package-lock.json,并重新安装了所有内容,这在本地有效。所以,我部署了它,现在一切正常。
每当我 npm 安装任何模块时,我的 ReactJS 应用程序总是崩溃。
您可以通过在终端上执行此操作来重现该问题。
create-react-app [项目名称]
cd [项目名称]
git 初始化
heroku git:remote -a [heroku 应用的名称]
git 添加 .
git commit -m "init"
git 推送 heroku 大师
您会发现一切正常,但稍后再试。
npm 安装反应-dom
(或任何 package/modules。使用 --save 也会产生相同的错误)
git 添加-u
git commit -m "new module"
git 推送 heroku 大师
应用程序会在服务器上崩溃,我不知道为什么。
注意:在这种情况下,react-dom 已经由 create-react-app 安装,所以 npm 只更新它。尽管如此,它还是崩溃了。您可以安装一个新模块,它的行为仍然相同。
根据要求,这是错误日志。
2017-06-30T20:12:46.778184+00:00 app[web.1]: npm ERR! spawn ENOENT
2017-06-30T20:12:46.778396+00:00 app[web.1]: npm ERR!
2017-06-30T20:12:46.778645+00:00 app[web.1]: npm ERR! Failed at the 007-test@0.1.0 start script.
2017-06-30T20:12:46.779136+00:00 app[web.1]: npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
2017-06-30T20:12:46.780482+00:00 app[web.1]:
2017-06-30T20:12:46.780763+00:00 app[web.1]: npm ERR! A complete log of this run can be found in:
2017-06-30T20:12:46.780934+00:00 app[web.1]: npm ERR! /app/.npm/_logs/2017-06-30T20_12_46_768Z-debug.log
2017-06-30T20:12:46.920375+00:00 heroku[web.1]: State changed from starting to crashed
2017-06-30T20:12:46.903436+00:00 heroku[web.1]: Process exited with status 1
2017-06-30T21:01:33.667285+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=react-app-007.herokuapp.com request_id=d4936b9c-4c21-4ce4-862c-8b05da3bc005 fwd="64.62.224.29" dyno= connect= service= status=503 bytes= protocol=https
2017-06-30T21:01:35.111452+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=react-app-007.herokuapp.com request_id=cef9f3f8-a46b-4760-9c24-de59ba540e2e fwd="64.62.224.29" dyno= connect= service= status=503 bytes= protocol=https
This sequence of commands should do the trick:
npm install -g create-react-app
create-react-app my-app
cd my-app
git init
heroku create -b https://github.com/mars/create-react-app-buildpack.git
git add .
git commit -m "react-create-app on Heroku"
git push heroku master
heroku open
我认为添加 React (-b https://github.com/mars/create-react-app-buildpack.git
) 的自定义构建包是您所缺少的。在 Heroku 项目仪表板的设置选项卡下,您可以将构建包添加到现有项目中。
-b
标志是 --buildpack
$ heroku help create
Usage: heroku create [APP] [flags]
creates a new app
Flags:
-b, --buildpack buildpack url to use for this app
-n, --no-remote do not create a git remote
-o, --org organization to use
-r, --remote the git remote to create, default "heroku"
-s, --stack the stack to create the app on
-t, --team team to use
--addons comma-delimited list of addons to install
--region specify region for the app to run in
--space the private space to create the app in
--ssh-git use SSH git protocol for local git remote
这是我电脑上的 heroku cli 版本:
$ heroku --version
heroku-cli/6.12.0-a504409 (darwin-x64) node-v7.10.0
有关 buildpacks
命令的特定信息:
$ heroku help buildpacks
Usage: heroku buildpacks [flags]
display the buildpack_url(s) for an app
Flags:
-a, --app (required) app to run command against
-r, --remote git remote of app to use
Examples:
$ heroku buildpacks
heroku buildpacks commands: (get help with heroku help buildpacks:COMMAND)
buildpacks display the buildpack_url(s) for an app
buildpacks:add URL add new app buildpack, inserting into list of buildpacks if necessary
buildpacks:clear clear all buildpacks set on the app
buildpacks:remove [URL] remove a buildpack set on the app
buildpacks:set URL set new app buildpack, overwriting into list of buildpacks if necessary
您可以 运行 heroku buildpacks:add https://github.com/mars/create-react-app-buildpack.git
而不是通过 Web 仪表板添加该构建包。
经过一番调试,我找到了根本错误。当我 npm 安装一个包时,它弄乱了构建。模块 react-scripts 不再工作了。
我将其从 devDependencies 移至 package.json 中的依赖项,删除了我的节点模块、package-lock.json,并重新安装了所有内容,这在本地有效。所以,我部署了它,现在一切正常。