Browserify mit Twitter Bootstrap

Es gibt hier viele ähnliche Fragen, einschließlich der Antworten zum Stapelüberlauf, aber keine davon hat für mich funktioniert, also frage ich euch hier. Ich schätze die Zeit aller.

Ich habe kürzlich angefangen, gulp mit browserify zu verwenden, und das funktioniert großartig. Ich habe dann versucht, browserify für das Front-End zu verwenden: Backbone und Bootstrap3.

Die Dinge scheinen zu funktionieren, bis ich versuche, die mit Bootstrap gelieferte js-Datei zu benötigen. In meinen Chrome-Tools wird ein Fehler angezeigt, der besagt: jQuery ist undefiniert.

Ich habe versucht, es einzuschieben, aber ich bin sehr verwirrt von dem Shim. Ich benutze jQuery 2.1.1, also sollte ich jQuery nicht shimen müssen, aber es existiert jetzt im Shim, da ich verzweifelt war und alles ausprobierte. Hier ist meine package.json und meine main.js Datei:

-------------- package.json ------------------

{
  "name": "gulp-backbone",
  "version": "0.0.0",
  "description": "Gulp Backbone Bootstrap",
  "main": "main.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && 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"
      ]
    }
  }
}

------------------------- main.js ----------------------

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');
});

Antworten auf die Frage(4)

Ihre Antwort auf die Frage