我们正在使用Create-React-App开发一个ReactJS应用程序,该应用程序由我们的Node/Express服务器提供服务,该服务器也提供API。我们使用node/JS构建包将整个服务器部署到Heroku,并尝试从节点package.json
文件中获取postinstall
脚本中的CRA构建步骤npm run build
,如@mars in this issue所建议。
问题是Heroku部署失败并出现此错误。请注意,此错误有时在本地发生,但随后web_app中的npm install
解决了此问题,但在Heroku中运行时却无法解决。我有两个相关问题:
1.如何在Heroku上部署一个同时支持API和Create-React-App应用的Node/Express应用?我可以提交我的构建目录,但这真的不是正确的方法。
1.为什么React脚本消失了,我必须运行多次npm install
。
9条答案
按热度按时间vof42yt11#
@约翰尼肯-
这正是问题所在,我已经在github的这篇文章中收到了来自Mars的答案:
@philjoseph,react-scripts是(默认情况下)CRA应用程序的devDependency,但Heroku节点构建包具有环境NODE_ENV=production,这导致npm安装跳过devDeps。
要同时安装这些devDeps,请执行以下操作:
npm安装--only=开发&& npm安装&& npm运行构建
他还提到了这一优秀的回购协议:https://github.com/mars/heroku-cra-node
我遵循了这一点,它的工作就像一个魅力:)
zed5wv102#
由于您在开发和生产中都需要“React脚本”,因此可以简单地移动“React脚本”:将“1.0.16”从**“devDependencies”转换为“dependencies”**,因此heroku不会忽略它。
6ss1mwsb3#
有一个非常简单的解决方案。在运行
start
脚本之前,Heroku将运行一个build
脚本,如果它在您的package.json
中。rbl8hiat4#
对于2021年的任何人,请遵循 Alexandria ·切列德尼琴科的“非常简单”的建议
说明:截至2021年10月,Create-React-App的react-script软件包存在大量安全漏洞。我想一些人可能会遇到他们的“修复”,建议将react-script移到devDependencies。如果你要部署到Heroku,这将不工作。将react-script移到devDependencies将导致此错误,因为Heroku需要react-script来构建React应用。在本地将是正常的。并且当您运行
npm audit --production
或yarn audit --production
时,您将没有漏洞。投票率最高的答案提供了一个很好的例子,由火星霍尔回购(Heroku的首席工程师)创建了一个从节点后端提供服务的react应用程序。不过,现在它也在react-ui/package.json文件的常规依赖项部分包含react-scripts。此外,由于Create-React-App现在默认为Yarn,添加的
npm install --only=dev
将不会运行也不会工作(我可以根据节点buildpack日志来判断)。此外,它可能会添加您的应用在生产中肯定不需要的测试依赖项。不幸的是,在Create-React-App决定做一些更新之前,最好忽略npm审计带来的问题(至少是与react-scripts相关的问题)。由于react-scripts是一个构建工具,因此产生的任何漏洞都极不可能被利用。
这可能更适合作为 Alexandria ·切雷德尼琴科回答的评论,但我离这样做还有一个名声。
希望有人真的觉得这很有帮助!
8ljdwjyq5#
在package.json中,react-scripts声明为devDependency还是常规依赖项?由于您是在Heroku上构建的,而heroku正在阅读env变量作为生产变量(我假设在这里),因此它不会安装react-scripts。请尝试将react-scripts作为常规依赖项移动,然后重试。
对于其他云提供商,我可能不会采用这种方法,但对于Heroku,这是我发现的阻力最小的方法。本文将更详细地介绍您的场景。https://originmaster.com/running-create-react-app-and-express-crae-on-heroku-c39a39fe7851
nfg76nw06#
我尝试了完全相同的事情,将create-react-app项目部署到heroku,并获得了
react-scripts not found something...
。Heroku将脚本读入
package.json
,但无法执行。解决这个问题的关键是“创建/发布”“scripts”文件夹,默认情况下
create-react-app
不会创建它,只是为了简化操作。因此,通过运行
eject
命令$npm run eject
,将创建与config
文件夹一样长的scripts
文件夹。之后,您可以再次执行heroku脚本,例如
$ git push heroku master
,希望它将在Heroku上部署所有内容。create-react-app文档中有关
eject
脚本的更多信息希望这对你有帮助,祝你好运。
33qvvth17#
你能分享一下你的Package.json文件脚本的样子吗?我昨天实际上部署到了Heroku,它似乎对我来说工作得很好。
可能您的依赖项没有正确添加到package.json中。
这是我的脚本的外观(如果你没有任何scss/less/sass,忽略前两个脚本):
当在开发中运行以利用我运行的Hotrealoding时
对于PROD,我运行
然后我部署到Heroku。尝试在一个单独的终端窗口中检查Heroku的日志,这样你就可以检查你的部署有什么问题。
只需使用
heroku logs
即可显示日志的最后100行。或者实时跟踪日志:
heroku logs -t
.cwxwcias8#
指定节点环境告诉heroku我们要使用的heroku版本。默认情况下heroku使用旧版本,这会使我们的应用程序崩溃。您有2个package.json文件,一个在客户端,另一个在Express服务器端。在Express服务器端,将此文件添加到package.json
指定启动脚本
“开始”:“节点索引. js”,
安装Heroku客户端
在Macos
默认情况下,heroku使用基于git的部署过程或工作流。
这个链接是我们的部署目标。它是一个git仓库,我们可以将本地服务器推送到它。
44u64gxh9#
我遇到了同样的问题,在看到@丹尼尔的评论后,我碰巧通过在
package.json
中添加几行(主项目的行,而不是客户端的行)来解决这个问题。这里发生的事情是Heroku正在搜索可用于在客户端安装依赖项和构建应用的React脚本。在我的例子中,这两个脚本都丢失了。事实上,这是我遇到问题时的脚本:
Heroku需要脚本
"install-client"
和"heroku-postbuild"
。我只是添加了它们,错误就消失了:我希望这能帮到一些人。