Question

我们正在使用Create-React-App开发一个ReactJS应用程序，该应用程序由我们的Node / Express服务器提供服务，该服务器也提供API。我们使用node / JS buildpack将整个服务器部署到Heroku，并尝试按照@mars {{3}的建议从节点npm run build文件中获取postinstall脚本中的CRA构建步骤package.json }。

问题是Heroku部署失败并出现此错误。请注意，这个错误发生在我本地的某个时间，但是web_app中的npm install正在解决问题，但在Heroku中运行时却没有。我有两个相关的问题：

如何向Heroku部署一个同时提供API和Create-React-App应用程序的Node / Express应用程序？我可以提交我的构建目录，但这确实不是正确的方法。
为什么react-scripts正在消失，我必须多次运行npm install。

Answer 1

@johnnycon -

这正是问题所在，我在Mars github issue post收到https://github.com/mars/heroku-cra-node的回答：

@philjoseph，react-scripts（默认情况下）是CRA应用程序的devDependency，但Heroku Node buildpack的环境NODE_ENV = production，导致npm install跳过devDeps。

也要安装这些devDeps：

npm install --only = dev＆amp;＆amp; npm install＆amp;＆amp; npm run build

他还指出了这个出色的回购：{{3}}

我跟着它，它就像一个魅力：）

Answer 2

由于您在开发和生产中都需要“react-scripts”，因此您可以简单地将“react-scripts”：“1.0.16”从“devDependencies”移动到“依赖项中“，所以heroku不会忽略它。

Answer 3

在package.json中，react-scripts是声明为devDependency还是常规依赖？由于你是在Heroku上构建的，而heroku正在将env变量读作生产（我假设在这里），它不会安装react脚本。尝试将react-scripts作为常规依赖项移动，然后重试。

对于其他云提供商，我可能不会遵循这条路径，但对于Heroku来说，这是我发现阻力最小的路径。本文将详细介绍您的方案。 https://originmaster.com/running-create-react-app-and-express-crae-on-heroku-c39a39fe7851

Answer 4

你能分享你的Package.json文件脚本的样子吗？我昨天实际上部署到了Heroku，它对我来说似乎工作得很好。

可能你的package.json中没有正确添加你的依赖项。

这就是我的脚本看起来的样子（如果你没有scss / less / sass忽略前两个脚本）：

"scripts": {
"build-css": "node-sass src/ -o src/",
"watch-css": "npm run build-css && node-sass src/ -o src/ --watch --recursive",
"start": "npm run start:server",
"watch": "npm-run-all --parallel watch-css start:*",
"start:server": "node server/server.js",
"start:client": "react-scripts start",
"build": "npm run build-css && react-scripts build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject",
"postinstall": "npm run build"}

在开发中运行以利用我运行的Hotrealoding

npm run watch

对于PROD我运行

npm run build

然后我部署到Heroku。尝试在单独的终端窗口中检查来自Heroku的日志，以便检查部署的问题。

只需使用heroku logs即可显示日志的最后100行。

或者实时拖尾日志：heroku logs -t。

Answer 5

我正在尝试完全相同的事情，将一个create-react-app项目部署到heroku ，并获得react-scripts not found something...。

Heroku将脚本读入package.json，但无法执行。

解决此问题的关键是“创建/发布”“脚本”文件夹，默认情况下 create-react-app不会创建它，只是保持简单。

通过运行eject命令$npm run eject，只要scripts文件夹创建config文件夹。

之后你可以再次执行heroku脚本，例如$ git push heroku master 希望它能在Heroku上部署所有内容。

有关create-react-app documentation

上的eject脚本的详细信息

希望这会有所帮助，祝你好运。

Answer 6

指定节点环境 告诉heroku我们要使用什么版本的heroku。默认情况下，heroku使用较旧的版本，这会使我们的应用程序崩溃。您有2个package.json文件，一个在客户端，另一个在快速服务器端。在快递服务器端，将此添加到package.json

"engines": {
    "node": "12.9.1",
    "npm": "6.10.2" },

指定启动脚本

 Instruct heroku what command it should run to start up our server. Add this to the server side package.json

“开始”：“节点index.js”，

INSTALL HEROKU CLI

安装Heroku Cli

Sudo apt-get update
curl https://cli-assets.heroku.com/install-ubuntu.sh | sh  or sudo snap install heroku

在macos中

brew install heroku cli

默认情况下，heroku使用基于git的部署过程或工作流程。

Git init
Git add . 
Git commit -m “initial commit”

Heroku login
Heroku create nameOfTheApp

 https://git.heroku.com/nameOfTheApp.git

此链接是我们的部署目标。这是一个git存储库，我们可以将本地服务器推送到它。

Git remote add heroku https://git.heroku.com/nameOfTheApp.git

Git push heroku master

Answer 7

有一个非常简单的解决方案。在运行start脚本之前，Heroku将运行build脚本，如果它在您的package.json中。

"scripts": {
  "start": "node server.js",
  "build": "cd client/ && yarn install && yarn build"
}

对Heroku的Create-React-App部署失败了`react-scripts：not found`

7 个答案: