I have a website that uses both English and French. I use the following command to build the application:
ng build --output-path=dist/fr --aot --prod --bh /fr/ --i18n-file=src/locale/messages.fr.xlf --i18n-format=xlf --locale=fr
ng build --output-path=dist/en --aot --prod --bh /en/
I copy both en and fr folders to the web root. Each folder has its own .htaccess as following:
<IfModule mod_rewrite.c>
Options Indexes FollowSymLinks
RewriteEngine On
RewriteBase /crisis-center/
RewriteRule ^index\.html$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.html [L]
</IfModule>
I also added a .htaccess to the web root:
<IfModule mod_rewrite.c>
Options Indexes FollowSymLinks
RewriteEngine On
RewriteBase /crisis-center/
RewriteRule ^index\.html$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{HTTP:Accept-Language} ^fr [NC]
RewriteRule ^$ /fr/ [R]
RewriteCond %{HTTP:Accept-Language} !^fr [NC]
RewriteRule ^$ /en/ [R]
</IfModule>
Everything works, except one issue: I can not refresh page. It will show a 404 error. I guess it's because of the .htaccess settings.
What is the problem?