express + stylus + jade, nothing gets compiled

Question

I cannot get this simple app.js to work: static files are served but jade and styl files are not compiled. Here the __dirname ls:

damianomacbook:www damiano$ ls
app.jade    app.js      app.styl    config.xml  johnd.jpg

.jade and .styl files are served normally and plain. Here what happens when curling css and html files (which the middlewares functions are supposed to generate on the fly):

damianomacbook:www damiano$ curl localhost:8080/app.css
curl: (52) Empty reply from server
damianomacbook:www damiano$ curl localhost:8080/app.html
Cannot GET /app.html

What's missing?

Guilty code:

var express = require('express');
var stylus = require('stylus');
var nib = require('nib');

var app = express();
function compile(str, path) {
   return 
      stylus(str)
      .set('filename', path)
      .use(nib());
}

app.use(express.logger('dev'));

app.set('views', __dirname);
app.set('view engine', 'jade');

app.use(stylus.middleware({ 
    src: __dirname,
    compile: compile
}));

app.use(express.static(__dirname));

app.listen(8080);

Answer 1

Your GET /app.html is failing because serving HTML pages is done with the express router, not middleware, and you don't have any routes defined. The static middleware doesn't convert anything (thus the name), so it's not going to serve /app.html unless there's an actual app.html file on disk. To get /app.html working, add:

app.get('/app.html', function (req, res) { res.render('app');});
//or you probably want app.get('/', ...if you want this to be your home page
//you probably also don't want/need ".html" in your URLs as this has fallen out of style

Your stylus problem is the automatic semicolon insertion monster. You must not put the "return" keyword on a line by itself. Your compile function is returning undefined instead of a stylus instance. Keep the compile formatted as it is on the nib documentation and all is well.