Amy bio photo


web dev, Society 6 creator, Udemy teacher, traveler, podcastaholic & IFPA-certified pilates lover

Email Twitter

Cross-posting this here from my “Web Musings” blog over at in the hopes that it helps another Angular wannabe.


How to remove URL # from Angular apps and allow page refreshing.


Create a .htaccess at root with the following, replacing "sub-folder" with the name of your parent directory. If you’re app lives at localhost/web server root, you won’t have a parent directory, so remove "/sub-folder" from the last line, leaving just /index.html.

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

Set $locationProvider.html5Mode(true); in your route config.

Define a base URL in your index.html that matches your project sub-folder: <base href="/sub-folder/" />. If at root, your base will be <base href="/" />.

Read about it in more detail over at the full post.