Error: Bootstrap's JavaScript requires jQuery

[renatonmendes]

I´m trying to use the whole structure in a new project with Webpack 2. For some reason I´m getting the following error:

webpack --colors --display-error-details --progress --config webpack/prod.config.js

  clean-webpack-plugin: D:\DEV\myprj\static\dist has been removed.
Hash: 2387464bdcca3b073b5a                                                      Version: webpack 2.2.1
Time: 6404ms
                       Asset    Size  Chunks                    Chunk Names
main-e3e431cb3191c47eae45.js  384 kB       0  [emitted]  [big]  main
  [10] ./~/react/react.js 56 bytes {0} [built]
  [14] (webpack)/buildin/global.js 509 bytes {0} [built]
 [156] ./~/react-redux/es/index.js 194 bytes {0} [built]
 [258] ./~/bootstrap-sass/assets/javascripts/bootstrap.js!./src/theme/bootstrap.config.prod.js 2.25 kB {0} [built] [failed] [1 error]
 [259] ./~/font-awesome-webpack/index.loader.js!./src/theme/font-awesome.config.prod.js 247 bytes {0} [built]
 [260] ./src/client.js 2.91 kB {0} [built]
 [263] ./~/babel-polyfill/lib/index.js 833 bytes {0} [built]
 [487] ./~/react-dom/index.js 59 bytes {0} [built]
 [560] ./~/react-router-redux/lib/index.js 1.97 kB {0} [built]
 [567] ./~/react-router/es/Router.js 5.3 kB {0} [built]
 [569] ./~/react-router/es/applyRouterMiddleware.js 1.9 kB {0} [built]
 [575] ./~/react-router/es/index.js 1.46 kB {0} [built]
 [597] ./~/redux-async-connect/lib/index.js 797 bytes {0} [built]
 [603] ./~/socket.io-client/lib/index.js 2.17 kB {0} [built]
 [620] multi bootstrap-sass!./src/theme/bootstrap.config.prod.js font-awesome-webpack!./src/theme/font-awesome.config.prod.js ./src/client.js 52 bytes {0} [built]
    + 606 hidden modules

ERROR in ./~/bootstrap-sass/assets/javascripts/bootstrap.js!./src/theme/bootstrap.config.prod.js
Module build failed: Error: Bootstrap's JavaScript requires jQuery
    at Object.<anonymous> (D:\DEV\myprj\node_modules\bootstrap-sass\assets\javascripts\bootstrap.js:8:9)
    at Module._compile (module.js:570:32)
    at Object.Module._extensions..js (module.js:579:10)
    at Module.load (module.js:487:32)
    at tryModuleLoad (module.js:446:12)
    at Function.Module._load (module.js:438:3)
    at Module.require (module.js:497:17)
    at require (internal/module.js:20:19)
    at loadLoader (D:\DEV\myprj\node_modules\loader-runner\lib\loadLoader.js:13:17)
    at iteratePitchingLoaders (D:\DEV\myprj\node_modules\loader-runner\lib\LoaderRunner.js:169:2)
    at runLoaders (D:\DEV\myprj\node_modules\loader-runner\lib\LoaderRunner.js:362:2)
    at NormalModule.doBuild (D:\DEV\myprj\node_modules\webpack\lib\NormalModule.js:129:2)
    at NormalModule.build (D:\DEV\myprj\node_modules\webpack\lib\NormalModule.js:180:15)
    at Compilation.buildModule (D:\DEV\myprj\node_modules\webpack\lib\Compilation.js:142:10)
    at factoryCallback (D:\DEV\myprj\node_modules\webpack\lib\Compilation.js:324:11)
    at D:\DEV\myprj\node_modules\webpack\lib\NormalModuleFactory.js:242:4
    at D:\DEV\myprj\node_modules\webpack\lib\NormalModuleFactory.js:93:13
    at D:\DEV\myprj\node_modules\tapable\lib\Tapable.js:204:11
    at NormalModuleFactory.params.normalModuleFactory.plugin (D:\DEV\myprj\node_modules\webpack\lib\CompatibilityPlugin.js:52:5)
    at NormalModuleFactory.applyPluginsAsyncWaterfall (D:\DEV\myprj\node_modules\tapable\lib\Tapable.js:208:13)
    at onDoneResolving (D:\DEV\myprj\node_modules\webpack\lib\NormalModuleFactory.js:68:11)
    at onDoneResolving (D:\DEV\myprj\node_modules\webpack\lib\NormalModuleFactory.js:189:6)
    at _combinedTickCallback (internal/process/next_tick.js:67:7)
    at process._tickCallback (internal/process/next_tick.js:98:9)
 @ multi bootstrap-sass!./src/theme/bootstrap.config.prod.js font-awesome-webpack!./src/theme/font-awesome.config.prod.js ./src/client.js

Why is it asking for jQuery ? Help appreaciated.

[ananddodia]

Yes getting same error with webpack 2. finding solution for this error. If any one found fix for it. Please share.

[raythree]

You should add this to your index.js, assuming you've added jquery to your package.json:

// bootstrap needs jquery available globally
window.jQuery = window.$ =  require('jquery/dist/jquery.min');

[ekropotin]

@raythree @renatonmendes Or you can use ProvidePlugin for this: plugins: [new webpack.ProvidePlugin({$: 'jquery', jquery: 'jquery', jQuery: 'jquery'})]