Deploying Create-React-App to Heroku failed with `response-scripts: not found`

We are developing a ReactJS app using Create-React-App, which runs from our Node / Express server, which also serves the API. We are deploying the entire server to Heroku using Node / JS buildpack and trying to get the CRA build step npm run build

in postinstall

script from the node file package.json

as suggested by @mars in this release .

The problem is Heroku deployment fails with this error. Note that this error happens to me sometimes locally, but then npm install

from web_app solves the problem, but not when running in Heroku. I have two related questions:

  • How do I deploy to Heroku a Node / Express app that serves both the API and Create-React-App? I can commit my assembly, but it really isn't.
  • Why do react scripts disappear and I have to run multiple times npm install

    .
+1


source to share


5 answers


@johnnycon -

It was exactly this problem and I got a response from Mars in this github release post :

@philjoseph, react (default) devDependency scripts for CRA apps, but Heroku Node buildpack has a NODE_ENV = production environment which forces npm install to skip devDeps.

To install these devDeps too:

npm install --only = dev && & npm install && & npm run build



He also pointed out this great repo: https://github.com/mars/heroku-cra-node

I followed this and it works like a charm :)

+11


source


Since you need "reactive scripts" in both development and production, you can simply move "reactive scripts": "1.0.16" from "devDependencies" to "dependencies" so the hero does not ignore it.



+3


source


Are react scripts declared as devDependency or regular dependencies in package.json? Since you are building on Heroku and heroiku reads the env variable as production (I'm assuming here), it won't install react-scripts. Try to translate react scripts as a regular dependency and try again.

With other cloud providers, I most likely won't follow this path, but with Heroku, it's the path of least resistance I've found. In this article, we will tell you a little more about your scenario. https://originmaster.com/running-create-react-app-and-express-crae-on-heroku-c39a39fe7851

+1


source


Can you share what the scripts for the Package.json files look like? I actually deployed to Heroku yesterday and seems to be working fine for me.

It might be that your dependencies are not added correctly to your package.json.

This is how my scripts look like. (if you don't have scss / less / sass ignore first 2 scripts)

"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"}

      

When starting in Development, in order to use Hotrealoding, I run

npm run watch

      

And for PROD I run

npm run build

      

And then I'll turn around to Heroku. Try checking the logs from Heroku in a separate terminal window so you can check what is wrong with your deployment.

Just use heroku logs

to display the last 100 lines of your logs.

Or for the tail of the logs in real time: heroku logs -t

Hope this helps you. Greetings

0


source


I tried exactly the same, deploy create-react-app project for heroku and got react-scripts not found something...

.

Heroku reads scripts in package.json

and cannot execute them.

The key to overcome this problem is to "create / publish" the script folder , which does not create it by default create-react-app

, just to keep things simple.

So, running the command eject

$npm run eject

, the folder scripts

created it, while the folder config

.

After that you can execute the hero script again, eg. $ git push heroku master

and hopefully he will deploy everything to Geroku.

More information about the eject

script on the Build-React Application Documentation

Hope this helps, good luck.

0


source







All Articles