Angular HTML5Mode - Rewrite rule Angular HTML5Mode - Rewrite rule angularjs angularjs

Angular HTML5Mode - Rewrite rule


Should have your path as: /Content/bootstrap.min.css

instead of: Content/bootstrap.min.css

Putting a '/' in front will resolve the path based on the the root directory.


I see the suggestions from @maurycy and up to a point, I agree with it. But this solution has its own limitations. What if you want to deploy your app in a new context i.e. https://www.mywebsite.com/my_new_app.

Now /Content/bootstrap.min.css will still point to https://www.mywebsite.com/bootstrap.min.css, which will again cause the issue.

In my opinion, if you want to control it, you can use a base tag. It defines what is the base URL of your website, and your browser will load all the relative URLs (the one which don't start with a /) with the base as a prefix to them. Set it in your HTML's head tag as follows:

<base href="/">

Now, all your assets will be loaded relative to this path, regardless of what your current browser URL is. Plus, you're free to specify any context here. For example, if you've deployed your app under /my_new_app, simply change the href to /my_new_app/ (don't forget the trailing slash), and the URLs will start loading relative to this path.

Hope this helps.