npm ERR! missing script: build when deploying react app to heroku - node.js

Question

I have a few small react web apps I have made that I am trying to deploy to heroku. I found this https://github.com/mars/create-react-app-buildpack through a youTube video and supposedly this is/was a simple method for deployment. There are several steps the author lists (first two don't apply):
git init
heroku create $APP_NAME --buildpack
https://github.com/mars/create-react-app-buildpack.git
git add .
git commit -m "Start with create-react-app"
git push heroku master
heroku open
Once I get to the git push heroku master I get an error in console that says:
npm ERR! missing script: build
remote:
remote: npm ERR! A complete log of this run can be found in:
remote: npm ERR! /app/.npm/_logs/2018-03-26T16_55_19_748Z-debug.log
remote: ! Push rejected, failed to compile React.js (create-react-app) multi app.
remote:
remote: ! Push failed
remote: Verifying deploy...
remote:
remote: ! Push rejected to my-simple-react-weather-app.
remote:
To https://git.heroku.com/my-simple-react-weather-app.git
! [remote rejected] master -> master (pre-receive hook declined)
error: failed to push some refs to 'https://git.heroku.com/my-simple-react-weather-app.git'
I did some searching and found a few build scripts for my package.json file but none of them seem to work (""build": " webpack --config webpack.conf.js"")
Here is my package.json:
{
"name": "redux-simple-starter",
"version": "1.0.0",
"description": "Simple React YouTube App",
"main": "index.js",
"scripts": {
"start": "node ./node_modules/webpack-dev-server/bin/webpack-dev-server.js",
"test": "mocha --compilers js:babel-core/register --require ./test/test_helper.js --recursive ./test",
"test:watch": "npm run test -- --watch"
},
"author": "",
"license": "ISC",
"devDependencies": {
"babel-core": "^6.2.1",
"babel-loader": "^6.2.0",
"babel-preset-es2015": "^6.1.18",
"babel-preset-react": "^6.1.18",
"chai": "^3.5.0",
"chai-jquery": "^2.0.0",
"jquery": "^2.2.1",
"jsdom": "^8.1.0",
"mocha": "^2.4.5",
"react-addons-test-utils": "^0.14.7",
"webpack": "^1.12.9",
"webpack-dev-server": "^1.14.0"
},
"dependencies": {
"babel-preset-stage-1": "^6.1.18",
"lodash": "^3.10.1",
"react": "^0.14.3",
"react-dom": "^0.14.3",
"react-redux": "4.3.0",
"react-router": "^2.0.1",
"redux": "^3.0.4",
"youtube-api-search": "0.0.5"
}
}
Can anyone help me out here? I am logged into my heroku account already. Is there a simpler way than what I am doing here?

Answer 1

If you provide a git repo it may help to git to the issue quickly but for now make sure you installed
react-scripts
npm i react-scripts --save-dev
make sure -dev is there so it runs before server launch for more details
also, keep your client ( react app ) package.json including the same
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
also its very important to make sure you are using the right buildpacks
if its only react app no node.js for more details
heroku create $APP_NAME --buildpack mars/create-react-app
but if you are building dual with node.js
heroku buildpacks:clear
and consider to follow instructions here How to use create-react-app with a custom Node server on Heroku

Answer 2

You mentioned that "build": " webpack --config webpack.conf.js" is not working. I am guessing that is why you omitted it from your package.json. This is what is needed to resolve the error message. Once you get this script working in your package.json, then all should be good.
Looking at the start script, it's possible that you need to run webpack by specifying it from the .bin directory. I'm not sure what version of node you are using.
scripts: {
...
"build": "./node_modules/.bin/webpack --config webpack.conf.js",
...
}

Answer 3

Try this:
"build": "webpack"
This where I got it from.
https://webpack.js.org/guides/getting-started/