score:28

Accepted answer

After trying many different things through trial/error, the solution is quite simple:

Serve the /client/build folder in the static call, like so:

app.use(express.static(path.join(__dirname, '../client/build')));

score:0

//on your react app run

npm run build

//The insert the following code on your server

const path = require("path");
app.use(express.static(path.join(__dirname,"nameOfYourReactApp","build")))

//Replace nameOfYourReactApp with the name of your app

score:0

my project structure
project
-->client
back end(express)\

after using npn run build i found out that index.html in build was using wrong directory of css files or static instead of using

const path = require('path');
app.use(express.static(path.join(__dirname, '/client/build/')));

i know i also tried ../client...... but not working

so what i did is cut and paste static folder of build in root directory this image can give you the idea, and its working structure

score:2

I had the same problem for a while and I would say that the solution that works is divided into 2 parts to avoid problems with the routers

  1. Server the static from the CRA build (in your case the client/build)
const buildPath = path.normalize(path.join(__dirname, '../client/build'));
app.use(express.static(buildPath));
  1. Set a final route (after all other routers in your server) to use the following:
const rootRouter = express.Router();
/* 
* all your other routes go here
*/
rootRouter.get('(/*)?', async (req, res, next) => {
  res.sendFile(path.join(buildPath, 'index.html'));
});
app.use(rootRouter);

Related Query

More Query from same tag