Brunch

01-readme.md

Brunch

This gist intend to explain my brunch workflow. Brunch is a build tool like Grunt or Gulp but faster and with no large script or config file. It will, i hope, soon be part of my little node framework : darjeeling #WIP

Directories organization

project
|-- application
|-- assets
|   |-- assets
|   |-- css
|   |-- js
|       |-- collections
|           |-- users.js
|       |-- lib
|       |-- models
|           |-- users.coffee
|       |-- vendor
|           |-- backbone-min.js
|           |-- underscore-min.js
|           |-- jquery-min.js
|       |-- views
|           |-- login.js
|       |-- app.coffee
|   |-- static
|       |-- file.jade
|-- system

Target

All files will be build into .tmp/public/ and serve via express static middleware

• Css files are build and export into /css
• Js files are build and export into /js/app.js and /js/vendor.js
• All other assets will be paste with same directory organization (ex: /fonts or /img)
• Jade static file are build and export at the root path

brunch-config.coffee

module.exports = config:
  
  # This defined the default path for assets
  conventions:
    assets: /^assets[\/\\]+assets[\/\\]+/

  # Export path and folder for front files
  paths: 
    public: '.tmp/public'
    watched: ['assets']

  # Files configuration
  files: 

    # Javascripts - JS build policy 
    javascripts: 
      joinTo: 
        'js/vendor.js': /^assets[\/\\]+js[\/\\]+vendor[\/\\]+/
        'js/app.js': /^assets[\/\\]+js[\/\\]+(?!vendor)/
      order: 
        before: [
          'assets/js//vendor/jquery-1.11.2.min.js',
          'assets/js/vendor/underscore-min.js',
          'assets/js/vendor/backbone-min.js'
        ]
    
    # Stylesheets - Stylesheet build policy 
    stylesheets: 
      joinTo: 
        'css/styles.css'
      order: 
        before: [
          'assets/css/reset.less', 
          'assets/css/text.less'
        ]
  
  # Overrides modules name
  modules:
    nameCleaner: (path) ->
      path
        # Strip app/ and app/externals/ prefixes
        .replace /^assets[\/\\]js[\/\\]?/, ''

  # Plugins - Jade static file to .html
  plugins: 
    jaded: 
      staticPatterns: /^assets(\/|\\)static(\/|\\)(.+)\.jade$/

package.json

{
  "name": "your-app-name",
  "version": "0.1.0",
  "description": "app-description",
  "private": true,
  "author": "your-name",
  "scripts": {
    "start": "brunch watch --server",
    "test": "brunch test"
  },
  "ignore": [
    "**/.*",
    "node_modules",
    "bower_components",
    "test",
    "tests"
  ],
  "license": "MIT",
  "devDependencies": {
    "javascript-brunch": "^1.7.1",
    "brunch": "^1.7.20",
    "less-brunch": "^1.8.1",
    "jaded-brunch": "^1.7.13",
    "uglify-js-brunch": "^1.7.7",
    "clean-css-brunch": "^1.7.2",
    "digest-brunch": "^1.5.1",
    "auto-reload-brunch": "^1.7.8"
  }
}