0

I installed bootstrap 4 with npm. I am currently using react library. I am transpiring wising babel for the es2015 and react. Also using webpack. At the console I am getting the following error regarding jQuery and is coming from the file transition.js:

    Uncaught ReferenceError: jQuery is not defined       transition.js

Here is the webpack config:

     const webpack = require('webpack');
     const path = require('path');
     const autoprefixer = require('autoprefixer');

     module.exports = {
entry: [
    "./client/main.js",
    "bootstrap-loader",

],
output: {
    path: './public',
    filename: "bundle.js",
    publicPath: '/'
},
devServer: {
    inline: true,
    contentBase: './public'
},
module: {
    loaders: [
        {
            test:/\.jsx?$/,
            exclude: /(node_modules|bower_components)/,
            loader: 'babel',
            query: {
                presets: ['react', 'es2015']
            }

        },
        { test: /\.css$/, loaders: [ 'style', 'css', 'postcss' ] },
        { test: /\.scss$/, loaders: [ 'style', 'css', 'postcss', 'sass' ] },
        { test: /bootstrap\/dist\/js\/umd\//, loader: 'imports?jQuery=jquery!./file.js' },
        { test: /\.(woff2?|ttf|eot|svg)$/, loader: 'url?limit=10000' },

    ]
},
postcss: [ autoprefixer ]

}

Rafael Flores
  • 77
  • 1
  • 7
  • Your jQuery loader differs from the documentation slightly - `{ test: /bootstrap\/dist\/js\/umd\//, loader: 'imports?jQuery=jquery' },` that might be it? – Jack Guy Feb 29 '16 at 23:08
  • @Harangue Tried that but it did not work. However found this post and it did helpedhttp://stackoverflow.com/questions/28969861/managing-jquery-plugin-dependency-in-webpack – Rafael Flores Mar 01 '16 at 16:22

1 Answers1

0

The problem was that I needed to use he following lines on the web pack config 

var webpack = require('webpack');
....
plugins: [
    new webpack.ProvidePlugin({
        $: "jquery",
        jQuery: "jquery"
    })
],

Found the answer in the following post: Managing jQuery plugin dependency in webpack

Community
  • 1
  • 1
Rafael Flores
  • 77
  • 1
  • 7