Rectangle 27 0

Compile stylus files with gulp watch. And code for express server js f...

I fixed it. Im not using nodejs to compile my stylus file anymore, instead im using gulp.

Started with installing node modules

npm init 
npm install -save express jade


// Step 1: Install gulp globally
npm install -g gulp

// Step 2: Install gulp in your project
npm install --save-dev gulp gulp-stylus gulp-plumber

npm install morgan body-parser --save
var express = require('express');
var stylus = require('stylus');
var logger = require('morgan');
var cookieParser = require('cookie-parser');
var bodyParser = require('body-parser');

var env = process.env.NODE_ENV = process.env.NODE_ENV || 'development';

var app = express();

//set view engine
app.set('views', __dirname + '/server/views');
app.set('view engine', 'jade');
app.use(logger('dev'));
app.use(bodyParser.urlencoded());
app.use(cookieParser());

//all public req will be responded by public dir now.
app.use(express.static(__dirname + '/public'));

//load route
app.get('*', function(req, res){
    res.render('index');
});

//start listening on server
var port = 3000;
app.listen(port);
console.log('Server running at localhost:' + port);
var gulp = require('gulp');
var stylus = require('gulp-stylus');
var plumber = require('gulp-plumber');

gulp.task('stylus', function() {
  gulp.src('public/stylesheets/style.styl')
    .pipe(plumber())
    .pipe(stylus())
    .pipe(gulp.dest('public/stylesheets'));
});

gulp.task('watch', function() {
  gulp.watch('public/stylesheets/*.styl', ['stylus']);
});

gulp.task('default', ['stylus', 'watch']);

I'm glad you figured it out. Gulp or Grunt are definietly the way to go.

node.js - Using stylus middleware with express 4, SyntaxError - Stack ...

node.js express stylus