使用 npm install 后 React 应用程序在 Heroku 上崩溃

IT技术 node.js reactjs heroku deployment npm-install
2021-05-08 09:26:50

每当我 npm 安装任何module时，我的 ReactJS 应用程序总是崩溃。

您可以通过在终端上执行此操作来重现该问题。

create-react-app [项目名称]
cd [项目名称]
git init
heroku git:remote -a [heroku 应用程序名称]
git add 。
git commit -m "init"
git push heroku master

您会看到一切正常，但请稍后再试。

npm install react-dom
（或任何包/module。使用 --save 也会产生相同的错误）

git add -u
git commit -m "new module"
git push heroku master

该应用程序将在服务器上崩溃，我不知道为什么。

注意：在这种情况下，react-dom 已经被 create-react-app 安装，所以 npm 只更新它。尽管如此，它还是崩溃了。您可以安装一个新module，它的行为仍然相同。

根据要求，这里是错误日志。

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
2个回答

这一系列命令应该可以解决问题：

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 仪表板添加该 buildpack。

经过一些调试，我发现了根本错误。当我 npm 安装一个包时，它搞砸了构建。module react-scripts 不再工作。

我将它从 devDependencies 移到 package.json 中的依赖项，删除了我的节点module package-lock.json，并重新安装了所有东西，并且在本地工作。所以，我部署了它，现在一切正常。

其它你可能感兴趣的问题
上一篇如何设置 react-datepicker 的样式？ 下一篇如何在 React 中获取提交的表单值？