Apache Config for React Router

.htaccess

<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>

Works great!

Children routing not loading.
I have following configuration in .htaccess file

RewriteEngine On RewriteBase **%{ENV:REACT_APP_SUBPATH}/** RewriteCond %{REQUEST_FILENAME} !-f RewriteCond %{REQUEST_FILENAME} !-d RewriteCond %{REQUEST_FILENAME} !-l RewriteRule . **/%{ENV:REACT_APP_SUBPATH}/**index.html [L]

In index.tsx file we mention that BrowserRouter basename=${ENV:REACT_APP_SUBPATH}

It is working for parent routes but children routes its not working means
http://sample.com/account -> this is working
http://sample.com/account/create -> this is not working it showing blank pages.

Sir you are a god among men. I've been trying to figure this out for hours.

I resolved it by implementing the following steps Step 1 Add the following in package.json "homepage": "." Step 2 Added the following in .htaccess <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> Step 3 Add the following in the public/index.html above meta:description <script type="text/javascript"> document.write("<base href='//" + document.location.host + "' />"); </script>

Thank you so much!

Will this work for dreamhost server as well?
I'm new and facing the same problem. Surfing on the internet for almost a week tried everything but nothing worked for me.

Will this work for dreamhost server as well? I'm new and facing the same problem. Surfing on the internet for almost a week tried everything but nothing worked for me.

Technically if your hosting is using Apache it will work, the only thing you will need is to create the file via FTP (Or your preferred way) in the folder of your website.

Here a link to dreamhost docs about creating the file.

When i host under direct domain its worked, But in sub folder blank page with favicon only displayed

for starting react app on different Port , you can use make file .env and in here you add next code PORT= 80 example if you start develop on port 80, or build app at this port.
This is possible because babel and other when build production code for final app looking this file and accepted . But , you must get attantion for admin premision on this port.
And setting virtual in access httpdocs .

For Nginx add / merge the following in your nginx config file
location / {
try_files $uri $uri/ /index.html;
}