Error when deploying React project to Heroku: “no such file or directory” for package.json

Question

I am new to Heroku and am facing problems pushing my code to Heroku. I have a React/Node JS project. My folder structure is as follows:

I had my package.json file initially under backend folder but due to buildpack error I moved it to the root folder.

When I try pushing code to Heroku I get the following error:

\ProductInventoryApp> git push heroku HEAD:master

Enumerating objects: 110, done.
Counting objects: 100% (110/110), done.
Delta compression using up to 8 threads
Compressing objects: 100% (107/107), done.
Writing objects: 100% (110/110), 425.50 KiB | 2.73 MiB/s, done.
Total 110 (delta 38), 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_ENV=production
remote:        NODE_MODULES_CACHE=true
remote:        NODE_VERBOSE=false
remote:
remote: -----> Installing binaries
remote:        engines.node (package.json):  unspecified
remote:        engines.npm (package.json):   unspecified (use default)
remote:
remote:        Resolving node version 12.x...
remote:        Downloading and installing node 12.14.1...
remote:        Using default npm version: 6.13.4
remote:
remote: -----> Installing dependencies
remote:        Installing node modules (package.json + package-lock)
remote:        added 161 packages from 100 contributors and audited 304 packages in 7.815s
remote:
remote:        2 packages are looking for funding
remote:          run `npm fund` for details
remote:
remote:        found 0 vulnerabilities
remote:
remote:
remote: -----> Build
remote:        Running heroku-postbuild
remote:
remote:        > ProductInventoryApp@1.0.0 heroku-postbuild /tmp/build_e7c760dc5d523bf5e1c2d0dc2b5b85cf
remote:        > NPM_CONFIG_PRODUCTION=false npm install --prefix client && npm run build --prefix client
remote:
remote:        up to date in 0.524s
remote:        found 0 vulnerabilities
remote:
remote: npm ERR! code ENOENT
remote: npm ERR! syscall open
remote: npm ERR! path /tmp/build_e7c760dc5d523bf5e1c2d0dc2b5b85cf/client/package.json
remote: npm ERR! errno -2
remote: npm ERR! enoent ENOENT: no such file or directory, open '/tmp/build_e7c760dc5d523bf5e1c2d0dc2b5b85cf/client/package.json'
remote: npm ERR! enoent This is related to npm not being able to find a file.
remote: npm ERR! enoent
remote:
remote: npm ERR! A complete log of this run can be found in:
remote: npm ERR!     /tmp/npmcache.HV3Sb/_logs/2020-01-12T03_23_13_871Z-debug.log
remote: npm ERR! code ELIFECYCLE
remote: npm ERR! errno 254
remote: npm ERR! ProductInventoryApp@1.0.0 heroku-postbuild: `NPM_CONFIG_PRODUCTION=false npm install --prefix client && npm run build --prefix client`
remote: npm ERR! Exit status 254
remote: npm ERR!
remote: npm ERR! Failed at the ProductInventoryApp@1.0.0 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.HV3Sb/_logs/2020-01-12T03_23_13_887Z-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:        Some possible problems:
remote:
remote:        - Node version not specified in package.json
remote:          https://devcenter.heroku.com/articles/nodejs-support#specifying-a-node-js-version
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 product-inventory-app.
remote:
To https://git.heroku.com/product-inventory-app.git
 **! [remote rejected] HEAD -> master (pre-receive hook declined)
error: failed to push some refs to 'https://git.heroku.com/product-inventory-app.git'**

I am not sure what's causing this. My package.json file is as follows:

{
  "name": "ProductInventoryApp",
  "version": "1.0.0",
  "description": "",
  "main": "backend/app.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "start": "node app.js",
    "client-install": "npm install --prefix client",
    "server": "nodemon app.js",
    "client": "npm start --prefix client", 
    "dev": "concurrently \"npm run server\" \"npm run client\"",
    "heroku-postbuild": "NPM_CONFIG_PRODUCTION=false npm install --prefix client && npm run build --prefix client" 
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "body-parser": "^1.19.0",
    "cors": "^2.8.5",
    "dotenv": "^8.2.0",
    "express": "^4.17.1",
    "express-validator": "^6.3.0",
    "mongodb": "^3.4.0",
    "mongoose": "^5.8.0",
    "uuid": "^3.3.3"
  },
  "devDependencies": {
    "concurrently": "^4.0.1"
  }
}

Answer 1

This is being caused by an issue with the heroku-postbuild script that you've defined. Remove it from the package.json file and redeploy to Heroku to resolve the issue.

Answer 2

try this.. it will help you out

"heroku-postbuild": "NPM_CONFIG_PRODUCTION=false npm install --prefix frontend && npm run build --prefix frontend"

basically, --prefix represents the path where react's package.json will exist... so, your react's package.json might be existed in frontend folder...

Answer 3

I've had the same problem until I've realised that my client/package.json was part of my .gitignore. If you are using Visual Studio, it does automatically add your package to it when creating gitignore.