I have a React app which runs fine locally but when I try to build it on the static Node server serve (npm serve) using
serve -s build
the server returns a 404 The requested path could not be found page. My understanding is the issue has to do with the fact I am using BrowserRouter in the application. I put a .htaccess file in the root directory with the following code but it did not solve the issue.
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index\.html$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME} !-l
RewriteRule . /index.html [L]
</IfModule>
One suggestion I saw for a Node environment follows but I don't understand where to put the code.
app.get('*', function (req, res) {
res.send('index_path')
})
My index.js file is as follows.
import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import { Route, Switch, BrowserRouter as Router } from 'react-router-dom';
import App from './App';
import Service from './javascript/Service';
import { PageNotFound } from './PageNotFound';
import * as serviceWorker from './serviceWorker';
const routing = (
<Router>
<Switch>
<Route exact path="/" component={App} />
<Route path="/Service/:serviceName" component={Service} />
<Route component={PageNotFound} />
</Switch>
</Router>
);
ReactDOM.render(routing, document.getElementById('root'));
serviceWorker.unregister();