title: Loading local file in browser referenced css or js
body: <p>This could be a basic problem but some how is not working for me.</p>
  
  <p>Here is my html:</p>
  
  <pre><code>&lt;!doctype html&gt;
    &lt;head&gt;
      &lt;meta charset="utf-8"&gt;
      &lt;meta http-equiv="X-UA-Compatible" content="IE=edge"&gt;
      &lt;base href="/"&gt;
      &lt;title&gt;&lt;/title&gt;
      &lt;meta name="description" content=""&gt;
      &lt;meta name="viewport" content="width=device-width"&gt;
  
      &lt;link rel="stylesheet" href="app/app.css"/&gt;
    &lt;/head&gt;
    &lt;body ng-app="App"&gt;
      &lt;div&gt; Hi There&lt;/div&gt;
  
      &lt;script src="app/vendor.js"&gt;&lt;/script&gt;
      &lt;script src="app/app.js"&gt;&lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>This file is located at: <code>file:///Users/kiran/Documents/app/dist/public/index.html</code>
  Referenced files are located at:</p>
  
  <pre><code>app.css: file:///Users/kiran/Documents/app/dist/public/app/app.css
  vendor.js: file:///Users/kiran/Documents/app/dist/public/app/vendor.js
  app.js: file:///Users/kiran/Documents/app/dist/public/app/app.js
  </code></pre>
  
  <p>However, when I tried to open the file using browser->open, it says it cannot load the files with error:</p>
  
  <pre><code>Failed to load resource: net::ERR_FILE_NOT_FOUND file:///app/app.css
  Failed to load resource: net::ERR_FILE_NOT_FOUND file:///app/vendor.js
  Failed to load resource: net::ERR_FILE_NOT_FOUND file:///app/app.js
  </code></pre>
  
  <p>Behavior is same in firefox though error message is different. What do I have to do to make it work?
  Appreciate the help.</p>
  
  <p>Note: It works fine when I run a webserver, but I need to make this work with local references and also on webserver.</p>