after-brunch

For a new project at Creative Licence, we have been using the awesome Brunch. Brunch is an assembler for HTML5 applications, which means that all the work watching, compiling, optimizing and concatenating source files is handled for you. It also has a fantastic plugin ecosystem, so it supports a diverse range of languages and project architectures.

We are also trialling the use of a live styleguide for this project, and in order to keep this in sync with the project’s development, it’s necessary to update the styleguide after every Brunch compile.

Instead of creating a plugin for a tool with no API - which could have been a huge headache - we created a tiny CLI wrapper plugin for Brunch that will run command line processes after the compile event. It boils down to an array of commands that you store in your Brunch config.coffee.

Using after-brunch

To use after-brunch, add "after-brunch": "x.y.z" to your package.json of your brunch app. You could also just npm install after-brunch --save.

Then in your config.coffee just add any commands to the afterBrunch array in the config’s plugins object. For example, you might want to use styledocco to create a live styleguide for your projects stylesheets.

exports.config = {
  plugins: {
    afterBrunch: [
      "styledocco -n \"My Project\" css"
    ]
  }
}

Check it out

You can check out and contribute to after-brunch on GitHub.