title: Browserify with twitter bootstrap
body: <p>There are many similar questions including answers here on stack overflow, but none of them have worked for me, so here I am asking you guys.  I appreciate everyone's time.</p>
  
  <p>I recently started using gulp with browserify, and that works great.
  I then tried to use browserify for the front-end using: Backbone and Bootstrap3.</p>
  
  <p>things are appearing to work, until I try to require the js file that comes with Bootstrap.  I get an error in my chrome tools stating: jQuery is undefined.</p>
  
  <p>I have attempted to shim it in, but I am very confused by the shim.  I am using jQuery 2.1.1, so I should not need to shim jQuery, but it exists in the shim now, as I was desperate and trying everything.  Here is my package.json and my main.js file:</p>
  
  <p>--------------package.json------------------</p>
  
  <pre><code>{
    "name": "gulp-backbone",
    "version": "0.0.0",
    "description": "Gulp Backbone Bootstrap",
    "main": "main.js",
    "scripts": {
      "test": "echo \"Error: no test specified\" &amp;&amp; exit 1"
    },
    "author": "Rob Luton",
    "license": "ISC",
  
  
    "devDependencies": {
      "jquery": "^2.1.1",
      "backbone": "^1.1.2",
      "browserify": "^4.2.1",
      "gulp": "^3.8.6",
      "vinyl-source-stream": "^0.1.1",
      "gulp-sass": "^0.7.2",
      "gulp-connect": "^2.0.6",
      "bootstrap-sass": "^3.2.0",
      "browserify-shim": "^3.6.0"
    },
  
    "browser": {
      "bootstrap": "./node_modules/bootstrap-sass/assets/javascripts/bootstrap.js",
      "jQuery": "./node_modules/jquery/dist/jquery.min.js"
    },
  
    "browserify": {
      "transform": ["browserify-shim"]
    },
  
    "browserify-shim": {
      "jquery": "global:jQuery", 
      "bootstrap": {
        "depends": [
          "jQuery"
        ]
      }
    }
  }
  </code></pre>
  
  <p>------------------------- main.js ----------------------</p>
  
  <pre><code>var shim = require('browserify-shim');
  $ = require('jquery');
  var Backbone = require('backbone');
  Backbone.$ = $;
  var bootstrap = require('bootstrap');
  
  /* the following logs fine if I comment out the bootstrap require, otherwise I get 'jQuery undefined' */
  
  console.log(Backbone);
  $(function() {
      alert('jquery works');
  });
  </code></pre>