I'm trying to deploy create-react-app using express.js. I'm also using client side routing (react-router-dom v5) with basename my-app.
When I refresh page the following urls via browser:
- https://my-website.com/my-app/
- https://my-website.com/my-app/something -> everything works fine.
but when I refresh page with url https://my-website.com/my-app/:type/:id (for example: https://my-website.com/my-app/polar/12345.)
I'm getting following error:
Uncaught SyntaxError: Unexpected token '<' --> browser tries to load /js/chunk.js and /js/main.chunk.js files requesting these urls:
- https://my-website.com/my-app/polar/12345/static/js/chunk.js
- https://my-website.com/my-app/polar/12345/static/js/main.chunk.js
instead of these:
- https://mywebsite.com/my-app/static/js/chunk.js
- https://mywebsite.com/my-app/static/js/main.chunk.js . -> Files are located at these urls.
here is my express server file:
const path = require('path');
const express = require('express');
const app = express();
const root = path.join(__dirname, 'build');
app.use(express.static(root));
app.get('/*', (req, res) => {
console.log('requested!', req.originalUrl);
res.sendFile(path.join(__dirname, 'build', 'index.html'));
});
app.listen(9000, () => {
console.log('App is running on port 9000');
});
I'm deploying app via docker file into kubernetes cluster on AWS. Pages are served via nginx ingress controller.
Where should be the problem ?