Static Javascript files not loaded in Express app
        Posted  
        
            by 
                Dave Long
            
        on Stack Overflow
        
        See other posts from Stack Overflow
        
            or by Dave Long
        
        
        
        Published on 2011-10-20T22:44:57Z
        Indexed on 
            2011/11/18
            1:50 UTC
        
        
        Read the original article
        Hit count: 446
        
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.
© Stack Overflow or respective owner