Heroku cant find index.html file ' Error: ENOENT: no such file or directory'

I have created a basic login app with Node, express and Vue. I'm trying to push it to Heroku but I'm getting the error below. I know the file path below doesn't exist so my question is How do I make Heroku look for:

'/server/client/dist/index.html'

Instead of what it's looking for below:

zYow <—— 404 Not Found 136 B text/html; charset=utf-8 (<—> 22.6 ms) Error: ENOENT: no such file or directory, stat '/app/server/client/dist/index.html'

Here is my file structure:

index.js:

const express = require("express");
const volleyball = require("volleyball");
const cors = require("cors");

const app = express();

const auth = require("./auth/index");

app.use(
  cors({
    origin: "http://localhost:8080"
  })
);

app.use(volleyball);
app.use(express.json());

app.use(express.static(__dirname + "/client/dist/"));

app.get("/", (req, res) => {
  res.sendFile(__dirname + "/client/dist/index.html");
});

app.use("/auth", auth);

function notFound(req, res, next) {
  res.status(404);
  const error = new Error("Not found - " + req.originalUrl);
  next(error);
}

function errorHandler(err, res, next) {
  res.status(res.statusCode || 500);
  res.json({
    message: err.message,
    stack: err.stack
  });
}

app.use(notFound);
app.use(errorHandler);

const port = process.env.PORT || 3000;
app.listen(port, () => {
  console.log("Listening on port", port);
});