An easy way to improve AngularJS applications portability through the HTML base tag and jqlite.
Sometimes our AngularJS application works flawlessy on local stack, but it is suddenly broken once uploaded on the client’s production server.
Usually the cause is a routing problem, and quite often the solution is a last-second workaround. A wiser approach is to address a more portable routing from the beginning.
Add a base tag to the index.html file The tag specifies the base URL for all relative URLs in a document. There can be at maximum one in a document and it must be inside the head element. Usually it is placed as first inside the head.
Now we can prefix all the routing paths with our brad new deployPath value. The final routing configuration of the application will look something like this (UI-Router is used instead of the default ng-Router):
Voilà! By simply changing the href attribute of the base tag in the index.html we could deploy our application in any folder or subfolder we would like.
Remember: if you’re building an hi-securized application consider using this approach only during development. Global variables are a potential weakness in your code.