How to get Stylus to work with Express and Connect in CoffeeScript

Question

My app.coffee looks like this:

connect = require 'connect'
express = require 'express'
jade = require 'jade'
stylus = require 'stylus'

app = express.createServer()

# CONFIGURATION

app.configure(() ->
  app.set 'view engine', 'jade'
  app.set 'views', "#{__dirname}/views"

  app.use connect.bodyParser()
  app.use connect.static(__dirname + '/public')
  app.use express.cookieParser()
  app.use express.session({secret : "shhhhhhhhhhhhhh!"})
  app.use express.logger()
  app.use express.methodOverride()
  app.use app.router

  app.use stylus.middleware({
    force: true
    src: "#{__dirname}/views"
    dest: "#{__dirname}/public/css"
    compress: true
  })
)

# ROUTES

app.get '/', (req, res) ->
  res.render 'index',
    locals:
      title: 'Title'

# SERVER

app.listen(1234)
console.log "Express server listening on port #{app.address().port}"

Update: I don't get it to write the CSS-files at all.

Kurtis

Answer 1

Found the answer, added:

compile = (str, path, fn) ->
  stylus(str).set('filename', path).set('compress', true)

Kurtis

Also it's apparently good to move the stylus.middleware code above the connect.public. – Kurtis

... and you added that where exactly? – Visigoth

I agree with @ScottDavidTesler, this answer isn't complete. – Ushijima

Answer 2

You can of course provide your own compile function, but it unnecessarily overrides the default one. Instead, add debug option to your middleware call and inspect where things are going wrong:

  app.use stylus.middleware
    debug: true
    force: true
    src: "#{__dirname}/../public"
    dest: "#{__dirname}/../public"

For me, the problem was setting the wrong src/dest path. Are you sure your .styl files are indeed located in your views folder?

Dantzler