Webpack using bootstrap - jquery is not defined

Question

import $ from \'jquery\';
require(\"./node_modules/bootstrap/dist/css/bootstrap.min.css\")
require(\"./node_modules/bootstrap/js/dropdown.js\")
import React from \'r         


        

Answer 1

Install and use exports-loader for individual Dropdown imports with Bootstrap 4.0 and Webpack 3.

// webpack.config.js
module.exports = {
    ...
    plugins: [
        new webpack.ProvidePlugin({
           Dropdown: "exports-loader?Dropdown!bootstrap/js/dist/dropdown",
       })

---

Plugin or Individual import: require("./node_modules/bootstrap/js/dist/dropdown")

versus

Importing Bootstrap in its entirety:require("./node_modules/bootstrap")

---

References

• the Bootstrap 4.0 note on importing individual Bootstrap plugins with webpack
• xushao's answer
• Bhavyanshu Parasher's blog