Angular 2 routing raising 404 errors

Question

HTML5 PushState means refresh URL or enter direct URL in browser works perfectly fine when I run my angular app using 'npm start' command from VS 2015 command prompt. However when I deploy same application on IIS and change <base href="/"/> to <base href="/MyVirtualApplication/" /> then HTML5's PushState or History API doesn't work properly and raising 404 error.

Please do suggest.

Answer 1

EDIT: IIS Setup for Url Rewriting:

You need to install this to make the following work: http://www.iis.net/downloads/microsoft/url-rewrite

First Step:

Second Step:

I found a link which explains the solution: https://stackoverflow.com/posts/12614072/

OLD:

While running any application built with Angular 2 outside of the development environment setup by npm, you have to replace <base href="/"> with this:

<script>document.write('<base href="' + document.location + '" />');</script>

Note: This is only for production or if running out of the npm environment.