Question

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.

Answer 1

script takes the attribute src, not href