I am using express.js to an HTML file which further calls a bunch of JS files. The server seems to be working, however the JS and CSS files configured within the HTML are not being fetched by the browser.
var express = require('C:/Program Files/nodejs/node_modules/express/lib/express')
var app = express()
var path = require('C:/Program Files/nodejs/node_modules/path/path')
app.use(express.static(__dirname + '/lib'));
app.use(express.static(__dirname + '/js'));
app.use(express.static(__dirname + '/css'));
app.use(express.static(__dirname + '/img'));
app.get('/', function(req, res) {
res.sendFile(path.join(__dirname + '/index.html'));
});
app.listen(3000, function () {
console.log('Example app listening on port 3000!')
})
My html file is:
<html>
<head>
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
<script src="./css/source-sans-pro.js"></script>
<link href="css/ratchet.css" rel="stylesheet">
<link href="css/styles.css" rel="stylesheet">
</head>
<body>
<script id="home-tpl" type="text/x-handlebars-template">
<header class="bar-title"><h1 class="title">Employee Directory</h1> </header>
<div class="bar-standard bar-header-secondary"><input class='search-key' type="text" style="height:31px;"/></div>
<div class="content"><ul class='list'></ul></div>
</script>
<script id="employee-li-tpl" type="text/x-handlebars-template">
<li>
<a href="#employees/" class="tappable">
<img src='img/_.jpg'/>
<p> </p>
<p></p>
<span class="chevron"></span><span class="count"> </span>
</a>
</li>
</script>
<script id="employee-tpl" type="text/x-handlebars-template">
<header class="bar-title"><a class="button-prev" href="#">Back</a><h1 class="title">Details</h1></header>
<div class='content'>
<div class="details">
<img src='img/_.jpg'/>
<h1> </h1>
<h2></h2>
<h2></h2>
</div>
<ul class="list inset" style="clear:both;">
<li><a href="#employees/" class="tappable"> <p>View Manager</p><p></p><div class="action-icon icon-manager"/></a></li>
<li><a href="#employees//reports" class="tappable"> <p>View Direct Reports</p><p></p><div class="action-icon icon-reports"/></a></li>
<li><a href= "spark_widget.html?email=" target="_blank"><img src="/pix/byron_bay_225x169.jpg" ></a></li>
<li><a href="spark_widget.html?email=&call=1" target="_blank"><img src="/pix/byron_bay_225x169.jpg" </a></li>
<li><a href="message:" class="tappable"> <p>Message</p><p></p><div class="action-icon icon-sms"/> </a></li>
<li><a href="mailto:" class="tappable"><p>Email</p> <p></p><div class="action-icon icon-mail"/></a></li>
<li><a href="sms:" class="tappable"><p>Map</p> <p></p><div class="action-icon icon-location"/></a></li>
</ul>
</div>
</script>
<script id="reports-tpl" type="text/x-handlebars-template">
<header class="bar-title"><a class="button-prev" href="#">Back</a><h1 class="title">Direct Reports</h1></header>
<div class='content'>
<div class="details">
<img src='img/_.jpg'/>
<h1> </h1>
<h2></h2>
<h2></h2>
</div>
<ul class="list"></ul>
</div>
</script>
<script src="./phonegap.js"></script>
<script src="./lib/fastclick.js"></script>
<script src="./lib/zepto.min.js"></script>
<script src="./lib/handlebars.js"></script>
<script src="./js/storage/memory-store.js"></script>
<script src="./js/HomeView.js"></script>
<script src="./js/EmployeeView.js"></script>
<script src="./js/ReportsView.js"></script>
<script src="./js/main.js"></script>
</body>
</html>
When I render this using an IIS server, it works perfectly fine.
via Jagpreet Singh
No comments:
Post a Comment