I was originally super frustrated when trying to set up Stylus, because I would adjust my src and dest settings, , restart Node, refresh, and Stylus wasn’t compiling. This was on a page like http://localhost:3000/tasks. However, the src and dest paths were correct, and when I would restart Node and try to load the index page, http://localhost:3000, Stylus would then compile correctly.
So now that I’ve figured out that it’s compiling properly, but only from the home URL, I’m wondering if I have something set up wrong, because any changes to .styl files are not being updated until I refresh from the home page, not any GET parameter page.
var express = require('express');
var app = express();
var stylus = require('stylus');
app.configure(function () {
this.set("views", __dirname + "/views/jade");
this.set("view engine", "jade");
this.use(express.bodyParser());
this.use(express.methodOverride());
this.use(this.router);
this.use(stylus.middleware({
src: __dirname + '/views/styl', //styl files to be compiled
dest: __dirname + '/public/css', //destination for compiled css
compress: true
}));
this.use(express.static(__dirname + '/public'));
});
Is what I’m describing the normal process, or should Stylus recompile no matter what your URL is if it notices changes in a .styl file?
I ended up going with the default Stylus path, meaning using a directory called “stylesheets” in both my “views” and “public” directory, and the following code:
Stylus then looked for .styl files in /views/stylesheets, and compiled them to /public/stylesheets. For some reason, trying to change the name of the directories and being fancy with my paths got me into trouble. Judging from reading some of the forums, this seems to be not considered a bug at this time, but there it is.