• Command line utility for building front-end code

• npm install -g brunch

• Written in CoffeeScript
• Built and maintained by
  • Paul Miller
  • Nik Graf
  • Thomas Schranz
  • Elan Shanker
• http://github.com/brunch/brunch

• Compiles scripts/stylesheets/templates
• Lints them
• Wraps in Common.js or AMD modules (optional)
• Concatenates & minifies
• Generates source maps
• Copies and optimizes image assets
• Watches for file changes
• Notifies you of errors via console or notifications
• Auto reload (plugin)

 npm install -g brunch brunch new <skeleton url> <output directory> cd <output directory> brunch watch --server

Build

 brunch build --production [-e <config-override>]

• Brunch with Chaplin
  • CoffeeScript, Stylus, Handlebars
• Brunch with AngularJS
  • Coffeescript, Less, Jade
• Brunch with Ember
  • JavaScript, CSS, Handlebars
• And many more

• Just NPM modules

• module.exports = {
    brunchPlugin: true

• Plugin API
  • lint()
  • compile()
  • optimize()
  • onCompile() - after compilation is complete
• List of plugins

• You don't need to manually specify all the used files
• Brunch includes all scripts based on the "main" attribute in each bower.json
• But how does it track dependences, what if my dependency doesn't have a main attribute, multiple scripts need included, ect...?

• Specify order in brunch config

  exports.config =
      files:
        javascripts:
          joinTo:
            'javascripts/app.js': /^app/
            'javascripts/vendor.js': /^(?!app)/
          order:
            before: [
              'bower_components/jquery/jquery.js',
              'bower_components/underscore/underscore.js',
              'bower_components/backbone/backbone.js',
            ]
            

• Add overrides to bower.json

  {
    "dependencies": {"backbone": "*"},
    "overrides": {
      "backbone": {
        "main": "backbone.js",
        "dependencies": {
          "underscore": "~1.5.0",
          "jquery": "~2.0.0"
        }
      }
    }
  }

• Does a lot of things out-of-the box
• It's fast!
  • Recompiles only changed files and relies on cache for the rest (very important for watching/auto-reload)
• Simple
  • Config files for brunch are considerably shorter
    • Convention vs configuration
    • Plugins can share config attributes
  • Bower made a little easier