verekia / js-stack-from-scratch

🛠️⚡ Step-by-step tutorial to build a modern JavaScript stack.
MIT License
20.05k stars 1.99k forks source link

Webpack, bootstrap and pre-loading jquery #213

Open gaitat opened 7 years ago

gaitat commented 7 years ago

Type of issue: (feature suggestion, bug?)

suggestion

Chapter:

8

In chapter 8 you suggest using this code in order to include bootstrap in a project.

import $ from 'jquery'
import Tether from 'tether'

window.jQuery = $
window.Tether = Tether
require('bootstrap') 

Is there a reason not to use the following code that preloads jquery and tether so that you can just do import 'bootstrap'; in the project?

new webpack.ProvidePlugin({
  $: "jquery",
  jQuery: "jquery",
  "window.jQuery": "jquery",
  Tether: "tether",
  "window.Tether": "tether",
}),

The only drawback I have found is that eslint complains about $ being undefined but that can be solved by adding in .eslintrc.json the following:

  "env": {
    "jquery": true
  },
verekia commented 7 years ago

That is probably a cleaner way to do it, thanks for bringing it up :)