title: Cant get Marionette working with Browserify
body: <p>Ive been banging my head against the wall for hours on this and Im just stumped.  Any help is greatly appreciated!</p>
  
  <p>Basically, super basic repo setup to get Browserify working with Backbone and Marionette.  Just isnt happening.  </p>
  
  <p>app.js:</p>
  
  <pre><code>var View = require('./view'),
  $ = require('jquery'),
  Backbone = require('backbone'),
  Marionette = require('backbone.marionette');
  
  Backbone.$ = window.$;
  
  var myview = new View();
  myview.render();
  
  $('body').css('background-color','#f0f0f0');
  
  var mapp = new Marionette.Application();
  console.dir(Marionette);
  </code></pre>
  
  <p>Simple.  My view is event simpler:</p>
  
  <pre><code>var Backbone = require('backbone');
  
  module.exports = TestView = Backbone.View.extend({
  
      render: function() {
          $('body').append('&lt;p&gt;Hello world! (Backbone view rendered successfully!&lt;/p&gt;');
      }
  });
  </code></pre>
  
  <p>And finally my package.json snippet specific to browserify:</p>
  
  <pre><code>"browser": {
          "jquery": "./requires/jquery.js",
          "underscore": "./requires/underscore.js",
          "backbone": "./requires/backbone.js",
          "backbone.wreqr": "./requires/backbone.wreqr.js",
          "backbone.babysitter": "./requires/backbone.babysitter.js",
          "backbone.marionette": "./requires/backbone.marionette.js"
      },
      "browserify-shim": {
          "jquery": "$",
          "underscore": "_",
          "backbone": {
              "exports": "Backbone",
              "depends": [
                  "underscore:underscore"
              ]
          },
          "backbone.babysitter": {
              "exports": "Backbone.BabySitter",
              "depends": [
                  "backbone:Backbone"
              ]
          },
          "backbone.wreqr": {
              "exports": "Backbone.Wreqr",
              "depends": [
                  "backbone:Backbone"
              ]
          },
          "backbone.marionette": {
              "exports": "Marionette",
              "depends": [
                  "jquery:jQuery",
                  "backbone:Backbone",
                  "underscore:_"
              ]
          }
      },
      "browserify": {
          "transform": [
              "browserify-shim"
          ]
      }
  </code></pre>
  
  <p>I feel like Im 99% there!  The final issue is that jquery doesnt appear to be loading as a dependency for Marionette.  The console.log thats in app.js shows that $ for the Marionette object is undefined.  The error that shows in the console log when you run the app is:</p>
  
  <pre><code>this._deferred = Marionette.$.Deferred();
  Uncaught TypeError: Cannot call method 'Deferred' of undefined 
  </code></pre>
  
  <p>At this point its something stupid Im doing and I just cant put my finger on it.  If its any easier, you can check out the repo of a super basic project I creates solely to figure this out.</p>
  
  <p><a href="https://github.com/jkat98/browserifytest" rel="nofollow">https://github.com/jkat98/browserifytest</a></p>
  
  <p>Thanks!!!!!!</p>