Relative ui-router templateUrls in Ionic vs vanilla AngularJs

I'm using angularJs to create a SPA and using the same angularJs code to create an ionic app.

So far this has been an extremely straight forward process but now I have conflicts between AngularJs expecting me to use absolute urls:

templateUrl: "/views/login.html",

And Ionic expecting me to use relative urls:

templateUrl: "views/login.html",

I've explored 2 workarounds that I'm not satisfied with.

Option 1: 

var isIonic = window.ionic ? true : false;
var baseUrl = "/"

//templateURL paths must be relative for ionic
if(isIonic){
    baseUrl = "";
}

....

templateUrl: baseUrl + "views/login.html",

Option 2, In my index.html file:

<head>
....
    <base href="/">

And then I leave the base tag out in my ionic html file.

  • Option #1 works fine but the number of directives used turns this into an if/else nightmare
  • Option #2 works great in all browsers but it breaks my SVGs in Firefox.

Does anyone know of a better solution to handling templateUrls when angularJS in a web browser expects absolute paths, and ionic on a mobile device expects relative paths?