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

我正在尝试使用带有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.$ = $

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

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

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

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

看起来，就目前而言，ES6 import将无法使用jquery和bootstrap包，就像我尝试使用它们一样。

@ Enijar的解决方案对我不起作用。 不得不使用旧的CDN方法。

https://code.jquery.com/

我尝试了很多解决方案，但由于某种原因，我必须在基本脚本上以小写forms定义全局jquery（例如main.js） 

 import jQuery from 'jquery' global.jQuery = jQuery global.jquery = jQuery // jquery lowercase was the solution for me global.$ = jQuery let Bootstrap = require('bootstrap') import 'bootstrap/dist/css/bootstrap.css'

此解决方案也适用于vue-cli + jquery + bootstrap

Interesting Posts