Animaniacs presents: Good Idea / Bad Idea, the Bower and Gulp edition.

bad_idea.js

// BAD IDEA: Not enforcing any sorts of rules about how packages are composed.
//
// Bower allows developers to override certain properties of each package's bower
// definition. Which is handy when packages are badly composed.
//
// In everyone's defence, Bower is still relatively new and given that there's a
// seemingly infinite number of ways to get to the end-point, there really is no
// right or wrong way to do it.
//
"overrides": {

  // bootstrap-sass includes two files as the 'main' files of the package:
  //   - vendor/assets/stylesheets/bootstrap.css (which we don't want in our JS)
  //   - vendor/assets/javascripts/bootstrap.js  (which is actually a sprockets manifest
  //
  // To fix this, we need to tell Gulp to grab each individual JS file. An annoyance, but
  // hey -- the README does state that this is still being tested. YMMV, etc.
  //
  "bootstrap-sass-official": {
    "main": [
      "vendor/assets/javascripts/bootstrap/affix.js",
      "vendor/assets/javascripts/bootstrap/alert.js",
      "vendor/assets/javascripts/bootstrap/button.js",
      "vendor/assets/javascripts/bootstrap/carousel.js",
      "vendor/assets/javascripts/bootstrap/collapse.js",
      "vendor/assets/javascripts/bootstrap/dropdown.js",
      "vendor/assets/javascripts/bootstrap/tab.js",
      "vendor/assets/javascripts/bootstrap/transition.js",
      "vendor/assets/javascripts/bootstrap/scrollspy.js",
      "vendor/assets/javascripts/bootstrap/modal.js",
      "vendor/assets/javascripts/bootstrap/tooltip.js",
      "vendor/assets/javascripts/bootstrap/popover.js"
    ]
  },

  // Marionette's official bower package lists backbone.babysitter and backbone.wreqr
  // as dependencies -- which is fantastic, that's exactly what we want, because Gulp's
  // Bower plugin is smart enough to grab each module's dependencies.
  //
  // Unfortunately, the Marionette package definition lists two source files as the 
  // 'main' files (both identical, except one is configured for loading as an AMD module)
  // and both of those files already include the source for both wreqr and babysitter.
  //
  // Without these overrides, the final package will include the following:
  // 
  //   * 2 copies of Marionette
  //   * 2 copies of Backbone.Wreqr
  //   * 2 copies of Backbone.Babysitter
  //
  // *face-palm*
  // 
  "marionette": {
    "main": [
      "lib/backbone.marionette.js"
    ]
  },
  "backbone.babysitter": {
    "ignore": true
  },
  "backbone.wreqr": {
    "ignore": true
  }
}

good_idea.js

// GOOD IDEA: A uniform means of extracting source files from library packages and bundling them together:

var gulp   = require('gulp');
var gutil  = require('gulp-util');
var concat = require('gulp-concat');
var coffee = require('gulp-coffee');
var bower  = require('gulp-bower-files');
var uglify = require('gulp-uglify');

gulp.task('bower', function() {
  bower()
    .pipe(uglify())
    .pipe(concat('package.js'))
    .pipe(gulp.dest('public/js'));
});