使用Browserify在ES6中使用Bootstrap和jQuery包时出错

Question

我正在尝试使用带有jQuery的Bootstrap.我正在使用Browserify和Babel变换进行编译.我收到以下错误.

Uncaught ReferenceError: jQuery is not defined

我试过导入这样的包,但是我得到了上面的错误.

import $ from 'jquery';
import Bootstrap from 'bootstrap';

搜索周围,我找到了这个答案,所以我尝试了这个,但我仍然得到同样的错误.

import $ from 'jquery';
window.$ = window.jQuery = $;
import Bootstrap from 'bootstrap';
Bootstrap.$ = $;

我是否使用ES6错误地导入这些软件包,还是以不同的方式完成？我尝试的最后一件事是导入没有ES6的软件包,但是我仍然遇到了同样的错误.

window.$ = window.jQuery = require('jquery');
var Bootstrap = require('bootstrap');
Bootstrap.$ = $

Answer 1

接受的答案帮助我找到正确的轨道,但对我来说最终的解决方案有点短,所以我也会在这里发布.

// Importing jQuery in ES6 style
import $ from "jquery";

// We need to expose jQuery as global variable
window.jQuery = window.$ = $;

// ES6 import does not work it throws error: Missing jQuery 
// using Node.js style import works without problems
require('bootstrap');

Answer 2

正如Pete TNT提到的，我正在使用的 Bootstrap 包中存在一个错误。我改用这个 Bootstrap 包并对我的代码进行了以下更改。

window.$ = window.jQuery = require('jquery');
var Bootstrap = require('bootstrap-sass');
Bootstrap.$ = $;
require('../../../../../node_modules/bootstrap-sass/assets/javascripts/bootstrap');

看起来，暂时，ES6import无法按照我尝试使用它们的方式与jquery和包一起使用。bootstrap