I deployed my React application as static service. The app works fine for the root path (/), but when I try to access any subpage URL directly (e.g., /move-address-detail, /building-detail), I receive a 404 Not Found error.
I am using React Router for client-side routing, and I have added an .htaccess file in my project’s root directory with the following content:
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^.*$ /index.html [L]
</IfModule>
How can I resolve the 404 error and make app correctly serve the React app’s subpages?
Thanks in advance
This textbox defaults to using Markdown to format your answer.
You can type !ref in this text area to quickly search our full set of tutorials, documentation & marketplace offerings and insert the link!
Heya,
Can I ask why are you not using Routers?Tthese paths are meant to be handled by React Router client-side and not as actual files on the server.
Heya, @tumerseyrek
On top of what’s mentioned you can ensure that the .htaccess file is s placed in the correct location whch will be the root of your deployment directory.
Additionally, ensure that the server’s configuration allows .htaccess overrides. Open your Apache configuration file and check that the <Directory> directive contains AllowOverride All
Regards
Become a contributor for community
Get paid to write technical tutorials and select a tech-focused charity to receive a matching donation.
DigitalOcean Documentation
Full documentation for every DigitalOcean product.
Resources for startups and SMBs
The Wave has everything you need to know about building a business, from raising funding to marketing your product.
The developer cloud
Scale up as you grow — whether you're running one virtual machine or ten thousand.
Get started for free
Sign up and get $200 in credit for your first 60 days with DigitalOcean.*
*This promotional offer applies to new accounts only.