Menu
I want to host my react app in a subdirectory on my shared hosting account. Ie in the directory domain.com/mydirectory/. But when I type domain.com/mydirectory/ in the search bar it opens the index of the directory & not the React App itself.
I have already created a build version for my app. Hence the index.html file is at the root of the directory with the static folder & all the other contents that where created during the react-build script.
How can I make it work properly ? How can I configure my .htaccess file or what fix should I consider ?
809
How do I add htaccess file to react? In order for the routes to work in your React app, you need to add a . htaccess file. In the public_html folder, at the same level as the build file contents, add a new file and name it .
The universal-access-starter-pack package includes a preconfigured . htaccess file under the public folder that gets added to the built application. This file contains comments to explain the web server configuration requirements for React Router BrowserRouter enablement.
Use a dot for the path to create a React app in the current directory, e.g. npx create-react-app . or npx create-react-app . --template typescript for TypeScript projects. Make sure your folder name doesn't contain special characters, spaces or capital letters.
You can try to add a .htaccess file in your React directory with that source code into it.
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /subdirectory
RewriteRule ^index\.html$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME} !-l
RewriteRule . /index.html [L]
</IfModule>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
