Build fails on Nodejs (+ React) app deployment on Heroku

Question

I build an app to practice react with a nodejs backend. It work fine on localhost. But I needed to learn how to deploy it on Heroku. I followed Stephen Grider's Udemy course and tried to hosted it on Heroku.

But my build fails. I checked many times and ran npm install even. But I can't get it working.

This is my package.json in server

{
  "name": "react-movies",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "start": "node index.js",
    "server": "nodemon index.js",
    "client": "npm run start --prefix client",
    "dev": "concurrently \"npm run server\" \"npm run client\"",
    "heroku-postbuild": "NPM_CONFIG_PRODUCTION=false npm insall --prefix client && npm run build --prefix client"
  },
  "engines": {
    "node": "8.9.4",
    "npm": "5.7.1"
  },
  "author": "pankaja92",
  "license": "ISC",
  "dependencies": {
    "concurrently": "^3.5.1",
    "moviedb-promise": "^1.2.1",
    "express": "^4.16.3",
    "nodemon": "^1.17.2"
  }
}

And this is the build error I'm getting.

Counting objects: 25, done.
Delta compression using up to 4 threads.
Compressing objects: 100% (24/24), done.
Writing objects: 100% (25/25), 5.50 KiB | 2.75 MiB/s, done.
Total 25 (delta 15), reused 0 (delta 0)
remote: Compressing source files... done.
remote: Building source:
remote:
remote: -----> Node.js app detected
remote:
remote: -----> Creating runtime environment
remote:
remote:        NPM_CONFIG_LOGLEVEL=error
remote:        NODE_VERBOSE=false
remote:        NODE_ENV=production
remote:        NODE_MODULES_CACHE=true
remote:
remote: -----> Installing binaries
remote:        engines.node (package.json):  8.9.4
remote:        engines.npm (package.json):   5.7.1
remote:
remote:        Resolving node version 8.9.4...
remote:        Downloading and installing node 8.9.4...
remote:        Bootstrapping npm 5.7.1 (replacing 5.6.0)...
remote:        npm 5.7.1 installed
remote:
remote: -----> Restoring cache
remote:        Skipping cache restore (new-signature)
remote:
remote: -----> Building dependencies
remote:        Installing node modules (package.json + package-lock)
remote:
remote:        > [email protected] postinstall /tmp/build_ac7e6ff23b1b667ae4e3970742a18cc1/node_modules/nodemon
remote:        > node -e "console.log('u001b[32mLove nodemon? You can now support the project via the open collective:u001b[22mu001b[39mn > u001b[96mu001b[1mhttps://opencollective.com/nodemon/donateu001b[0mn')" || exit 0
remote:
remote:        Love nodemon? You can now support the project via the open collective:
remote:        > https://opencollective.com/nodemon/donate
remote:
remote:        added 319 packages from 194 contributors in 7.977s
remote:        Running heroku-postbuild
remote:
remote:        > [email protected] heroku-postbuild /tmp/build_ac7e6ff23b1b667ae4e3970742a18cc1
remote:        > NPM_CONFIG_PRODUCTION=false npm insall --prefix client && npm run build --prefix client
remote:
remote:
remote:        Usage: npm <command>
remote:
remote:        where <command> is one of:
remote:        access, adduser, bin, bugs, c, cache, ci, completion,
remote:        config, ddp, dedupe, deprecate, dist-tag, docs, doctor,
remote:        edit, explore, get, help, help-search, i, init, install,
remote:        install-test, it, link, list, ln, login, logout, ls,
remote:        outdated, owner, pack, ping, prefix, profile, prune,
remote:        publish, rb, rebuild, repo, restart, root, run, run-script,
remote:        s, se, search, set, shrinkwrap, star, stars, start, stop, t,
remote:        team, test, token, tst, un, uninstall, unpublish, unstar,
remote:        up, update, v, version, view, whoami
remote:
remote:        npm <command> -h     quick help on <command>
remote:        npm -l           display full usage info
remote:        npm help <term>  search for help on <term>
remote:        npm help npm     involved overview
remote:
remote:        Specify configs in the ini-formatted file:
remote:        /app/.npmrc
remote:        or on the command line via: npm <command> --key value
remote:        Config info can be viewed via: npm help config
remote:
remote:        [email protected] /tmp/build_ac7e6ff23b1b667ae4e3970742a18cc1/.heroku/node/lib/node_modules/npm
remote:
remote:        Did you mean one of these?
remote:        install
remote:        uninstall
remote: npm ERR! code ELIFECYCLE
remote: npm ERR! errno 1
remote: npm ERR! [email protected] heroku-postbuild: `NPM_CONFIG_PRODUCTION=false npm insall --prefix client && npm run build --prefix client`
remote: npm ERR! Exit status 1
remote: npm ERR!
remote: npm ERR! Failed at the [email protected] heroku-postbuild script.
remote: npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
remote:
remote: npm ERR! A complete log of this run can be found in:
remote: npm ERR!     /tmp/npmcache.31Mmf/_logs/2018-03-22T20_32_50_639Z-debug.log
remote:
remote: -----> Build failed
remote:
remote:        We're sorry this build is failing! You can troubleshoot common issues here:
remote:        https://devcenter.heroku.com/articles/troubleshooting-node-deploys
remote:
remote:        If you're stuck, please submit a ticket so we can help:
remote:        https://help.heroku.com/
remote:
remote:        Love,
remote:        Heroku
remote:
remote:  !     Push rejected, failed to compile Node.js app.
remote:
remote:  !     Push failed
remote: Verifying deploy...
remote:
remote: !       Push rejected to findthemovie.
remote:

What have I done wrong ? Why's my build is failing ?

Can anyone help me with this ?

BobserLuck · Accepted Answer · 2018-03-22 20:46:53Z

3

Would put this as a comment but can't yet, check a spelling error in config file "heroku-postbuild": "NPM_CONFIG_PRODUCTION=false npm insall --prefix client && npm run build --prefix client"

Ain't that supposed to be install?

answered Mar 22, 2018 at 20:46

BobserLuck

4411 gold badge3 silver badges14 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Thidasa Pankaja Over a year ago

How dumb I am. Thanks. I thought I might have configured something incorrectly.

BobserLuck Over a year ago

@ThidasaParanavitharana No problem, got to love those spelling errors. Spend hours trying to figure out what's wrong with a piece of code and turns out your'e one letter off for a command spelling. Then you have the option of breaking your fingers for typing it wrong, plucking your eyeballs for not seeing it, or tossing your computer out the door in frustration. Fun times...

Zeyad Shaban Over a year ago

The probelm is that no code editor can highlight those errors...

Logan_B · Accepted Answer · 2018-03-22 20:47:19Z

1

npm install

> NPM_CONFIG_PRODUCTION=false npm insall --prefix client && npm run build --prefix client

should be

> NPM_CONFIG_PRODUCTION=false npm install --prefix client && npm run build --prefix client

answered Mar 22, 2018 at 20:47

Logan_B

5271 gold badge7 silver badges24 bronze badges

1 Comment

Thidasa Pankaja Over a year ago

Thanks. I thought I might have configured something incorrectly.

groenhen · Accepted Answer · 2018-10-14 12:13:08Z

1

I believe there is a typo in your code.
It should be install instead of insall :

NPM_CONFIG_PRODUCTION=false npm install --prefix client && npm run build --prefix client

edited Oct 14, 2018 at 12:13

groenhen

3,02725 gold badges51 silver badges69 bronze badges

answered Oct 14, 2018 at 11:25

Mani

691 silver badge4 bronze badges

Comments

Mohamed Wazeem · Accepted Answer · 2020-09-04 05:21:17Z

0

add this code in server.js file

if (process.env.NODE_ENV === "production") {
  app.use(express.static(path.join(__dirname, "client/build")));
  app.get("*", (req, res) => {
    res.sendFile(path.resolve(__dirname, "client", "build", "index.html"));
  });
}

answered Sep 4, 2020 at 5:21

Mohamed Wazeem

1

Collectives™ on Stack Overflow

Build fails on Nodejs (+ React) app deployment on Heroku

4 Answers 4

3 Comments

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

3 Comments

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related