angular2 <base href="/"> confusing browser

Question

if I build an angular2 app, I can easily go into my dev folder, double-click on my index.html and the browser will open the page and get all resources displaying the app right - without any local dev-server.

But when I add the <base href="/"> tag in index.html that I NEED for angular's router to work, the browser can't load the page anymore.

Using a dev-server this works fine.

Can someone explain me what's the reason for that ??

Answer 1

When you use <base href="/"> and open the index.html directly base is considered to be a file file:///C:/, or similar, depending on where your file is.

One solution is to use relative path: with <base href="./"> base will be current folder where your file is. You can use this if you have to run app from USB stick, for example