Express static server returns html for bundle.js for react build from webpack

Question

I'm trying to serve a production build react app using express.static middleware but always get a blank page. Upon investigation, I've noticed that the bundle.js content is in fact html for some reason. The middleware and config is as follows.

app.use(express.static(path.join(__dirname, 'client/dist')));
app.get('*', (req, res) =>
  res.sendFile(path.join(__dirname, '/client/dist/index.html'))
);

Answer 1

Bit of a strange one this, splitting js & css into sub directory seems to have done the trick.

Initial dist structure,

/dist
index.html
bundle.js
main.css

split files as following

/dist
index.html
 /js
  bundle.js
 /css
  main.css