htaccess redirect for Angular routes

Use a snippet like:

RewriteEngine onRewriteCond %{REQUEST_FILENAME} -s [OR]RewriteCond %{REQUEST_FILENAME} -l [OR]RewriteCond %{REQUEST_FILENAME} -dRewriteRule ^.*$ - [NC,L]RewriteRule ^(.*) /index.html [NC,L]

This will skip to the actual resource if there is one, and to index.html for all AngularJS routes.

There is a problem if app requested directive template file, but file is missing. In some case it caused app requested multiple script file in the index.html.

we should send 404 response instead of index.html file if file does not exist. So i add simple regex pattern to identify missing file request.

RewriteEngine On# If an existing asset or directory is requested go to it as it isRewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -f [OR]RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -dRewriteRule ^ - [L]# If the requested pattern is file and file doesn't exist, send 404RewriteCond %{REQUEST_URI} ^(\/[a-z_\-\s0-9\.]+)+\.[a-zA-Z]{2,4}$RewriteRule ^ - [L,R=404]# otherwise use history routerRewriteRule ^ /index.html

A poor man's solution (not using mod_rewrite):

ErrorDocument 404 /index.html