score:-4

Not having used Heroku, I would guess the problem is '/app/client/build/index.html'.

Is it really under /app/? Maybe you should be using a relative path like:

app/client/build/index.html

score:0

I had the same in a project React with NodeJS and Express. In the folder where I have NodeJS files(so not in the client folder, where React is) I have in the package.json this:

"scripts": {
    "start": "node server.js",
    "server": "nodemon server.js",
    "client": "npm start --prefix client",
    "client-install": "npm install --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"
  },

And in the server.js I have:

// Serve static assets in production
if (process.env.NODE_ENV === 'production') {
  // Set static folder
  app.use(express.static('client/build'));

  app.get('*', (request, response) => {
    response.sendFile(path.resolve(__dirname, 'client', 'build', 'index.html'));
  });
}

In the same folder(NodeJS) I have a file production.js for Mongo user and pass:

module.exports = {
  mongoURI:
    'mongodb+srv://yyyyyyyyy:xxxxxxxx@cluster0-pana5.mongodb.net/test?retryWrites=true&w=majority',
};

So in server.js I bring this file:

const db = require('./config/production').mongoURI;

and still here, connect to MongoDB, using db:

mongoose
  .connect(db, {
    useNewUrlParser: true,
    useCreateIndex: true,
    useFindAndModify: false
  })
  // use a promise to check if success
  .then(() => console.log('MongoDB Connected!'))
  .catch(error => console.log('MongoDB did not connect: ', error));

For me worked like this.

score:0

First you create a folder with the name of the app and put your client folder on it.

After that, yo ugo on the server.js file.

if (process.env.NODE_ENV) {
  //static folder add
app.use(express.static('app/client/build'));
app.get("*", function (req, res) {
  // res.sendFile(path.resolve('client', 'build' , 'index.html'));
  res.sendFile(path.resolve(__dirname , "app/client/build", "index.html"));
});
}

After that you change the package.json file.

"scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "start": "node server.js",
    "server": "nodemon server.js",
     "client": "npm start --prefix client",
     "client-install": "npm install --prefix client",
    "dev": "concurrently \"npm run server\" \"npm run client\"",
    "heroku-postbuild": "cd app && cd client && npm install --only=dev && npm 
     install && npm run build",
    "full-install": "npm install && npm install --prefix client"
   },

Then your problem is resolved.

score:1

I had the same error but my issue was none of the above, so I decided to post it here - maybe could help someone.
I wanted to deploy my current working branch, which is not master, but when running the command git push heroku master I wasn't realizing that the branch being deployed by default was master. As I'm ahead of master by a few commits including wiring up my server.js file in a new location, heroku wasn't able to find it.
So actually my solution was as simple as running git push heroku <current-branch-name>:master instead and now everything is working fine.

score:5

I just ran into the same issue. You need to add a heroku-postbuild script in your package.json. I used create-react-app for my project, so if you didn't this line may differ a bit:

"heroku-postbuild": "cd client && npm install --only=dev && npm install && npm run build"

When I run npm run build, create-react-app compiles a minified index.html file in the build/ folder, so you might need to modify the command if the build file you are pointing to lies elsewhere.

My server structure is like this:

server.js
client/
  build/
  public/
    - index.html
  src/
    - index.js


I found the solution in this handy article


Related Query

More Query from same tag