Add custom middleware without overwriting the default ones

[szimek]

I'd like to add just a single middleware (modrewrite) to existing ones and configure serving static files via base option. However, providing middleware option overwrites the default middleware stack.

connect: {
  livereload: {
    base: [
      '.tmp',
      '<%= yeoman.app %>'
    ],
    options: {
      middleware: function (connect, options) {
        return [
          require('connect-modrewrite')([
            '!\\.ttf|\\.woff|\\.ttf|\\.eot|\\.html|\\.js|\\.css|\\.png|\\.jpg|\\.gif|\\.svg$ /index.html [L]'
          ])
        ];
      }
    }
  }
}

It would be great if there was a way to just add new middlewares to the stack.

It possibly could be done by providing the default stack (one returned by the default middleware function) that would be passed to custom middleware function as a third argument:

// connect.js file
var options = this.options({
  ...
  middleware: function(connect, options, stack) { return stack; }
});

var stack = function(connect, options) {
  var middlewares = [];
  // the default middleware stack
  return middlewares;
}.call(this, connect, options);

var middleware = options.middleware ? options.middleware.call(this, connect, options, stack) : stack;

I'm not sure if this is going to work, but at least in theory it should allow to add a new middleware to an existing stack:

middleware: function (connect, options, stack) {
  stack.unshift(require('connect-modrewrite')([...]);
  return stack;
}

One could also overwrite the default stack by simply returning a new stack from middleware function (the current behavior) e.g.:

middleware: function (connect, options) {
  return [connect.static("/")];
}

[shama]

This is interesting and I can see how it could be convenient but configuring your own middleware along with replicating the existing, is convenient enough, imo. The default middleware only looks complex to accommodate all the options thrown at it but when customizing middleware, it doesn't need to be. For example if you want modrewrite, static and directory it would be:

middleware: function(connect, options) {
  return [connect.static('base'), connect.directory('base'), require('connect-modrewrite')()];
}

You could even use options.base instead of the string.

This task gives you a reasonable default middleware stack but then should get out of your way when customizing.

[szimek]

Yeah, you're right. My specific use case was to modify grunt configuration generated by angular generator to support HTML5 history API. The generator creates a config with base option as an array of paths and to add modrewrite middleware to the stack I need to replace them with connect.static('...'). Being able to add it before an existing stack would require a few less changes.