Static Javascript files not loaded in Express app
- by Dave Long
I have an express app that has a bunch of static javascript files that aren't being loaded even though they are registered in my app.js file. Even public scripts (like jQuery: http://ajax.googleapis.com/ajax/libs/jquery/1.6.3/jquery.min.js) aren't processing. I can see the script tags in the generated html, but none of the functionality runs and I can't see the files loading in the web inspector.
Here is the code that I have:
app.js
var express = require('express')
var app = module.exports = express.createServer();
// Configuration
var port = process.env.PORT || 3000;
app.configure(function(){
app.set('views', __dirname + '/views');
app.set('view engine', 'jade');
app.use(express.bodyParser());
app.use(express.methodOverride());
app.use(app.router);
app.use(express.static(__dirname + '/public'));
});
app.configure('development', function(){
app.use(express.errorHandler({ dumpExceptions: true, showStack: true }));
});
app.configure('production', function(){
app.use(express.errorHandler());
});
// Routes
app.get('/manage/new', function(req, res){
res.render('manage/new', {
title: 'Create a new widget'
});
})
app.listen(port);
console.log("Express server listening on port %d in %s mode", app.address().port, app.settings.env);
/views/manage/layout.jade
!!! 5
html(lang="en")
head
title= title
link(rel="stylesheet", href="/stylesheets/demo.css")
link(rel="stylesheet", href="/stylesheets/jquery.qtip.css")
script(type="text/javascript", href="http://ajax.googleapis.com/ajax/libs/jquery/1.6.3/jquery.min.js")
body!= body
script(type="text/javascript", href="/javascripts/jquery.formalize.js")
script(type="text/javascript", href="/javascripts/jquery.form.js")
script(type="text/javascript", href="/javascripts/jquery.qtip.js")
script(type="text/javascript", href="/javascripts/formToWizard.js")
script(type="text/javascript", href="/javascripts/widget.js")
/views/manage/new.jade
h1= title
div(style="float:left;")
form(action="/manage/generate", method="post", enctype="multipart/form-data", name="create-widget")
.errors
fieldset
legend Band / Album Information
fieldset
legend Social Networks
fieldset
legend Download
All of my javascript files are stored in /public/javascripts and all of my static CSS files are being served up just fine. I'm not sure what I've done wrong.