CODEWITHSUNDEEP
javascriptcsshtmlangularjsgoogle-chrome
Kiran
Kiran

Reputation: 5526

Loading local file in browser referenced css or js

This could be a basic problem but some how is not working for me.

Here is my html:

<!doctype html>
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <base href="/">
    <title></title>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width">

    <link rel="stylesheet" href="app/app.css"/>
  </head>
  <body ng-app="App">
    <div> Hi There</div>

    <script src="app/vendor.js"></script>
    <script src="app/app.js"></script>
</body>
</html>

This file is located at: file:///Users/kiran/Documents/app/dist/public/index.html Referenced files are located at:

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

However, when I tried to open the file using browser->open, it says it cannot load the files with error:

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

Behavior is same in firefox though error message is different. What do I have to do to make it work? Appreciate the help.

Note: It works fine when I run a webserver, but I need to make this work with local references and also on webserver.

Upvotes: 2

Views: 3735

Answers (2)

Martijn de Langh
Martijn de Langh

Reputation: 415

remove 

<base href="/">

edit links with ./ prefix

src="./app/vendor.js"

Upvotes: 1

msapkal
msapkal

Reputation: 8346

That's happening becuause you have <base> tag.

The base URL to be used throughout the document for relative URL addresses.

Since the base URL href is '/', it always start from root. So on local machine it doesn't find any css/js files, as it would check the files from root i.e. C/D/E drive. And it totally works fine for webserver, since the root would be your public folder.

Get rid of base tag.

Upvotes: 7

Related Questions