I\'m exploring the idea of using Webpack with Backbone.js.
I\'ve followed the quick start guide and has a general idea of how Webpack works, but I\'m unclear on how
It's both possible: You can include libraries with a (i. e. to use a library from a CDN) or include them into the generated bundle.
If you load it via tag, you can use the externals option to allow to write require(...) in your modules.
Example with library from CDN:
// the artifial module "jquery" exports the global var "jQuery"
externals: { jquery: "jQuery" }
// inside any module
var $ = require("jquery");
Example with library included in bundle:
copy `jquery-git2.min.js` to your local filesystem
// make "jquery" resolve to your local copy of the library
// i. e. through the resolve.alias option
resolve: { alias: { jquery: "/path/to/jquery-git2.min.js" } }
// inside any module
var $ = require("jquery");
The ProvidePlugin can map modules to (free) variables. So you could define: "Every time I use the (free) variable xyz inside a module you (webpack) should set xyz to require("abc")."
Example without ProvidePlugin:
// You need to require underscore before you can use it
var _ = require("underscore");
_.size(...);
Example with ProvidePlugin:
plugins: [
new webpack.ProvidePlugin({
"_": "underscore"
})
]
// If you use "_", underscore is automatically required
_.size(...)
Summary:
tag and externals optionresolve options to find the library)externals: Make global vars available as moduleProvidePlugin: Make modules available as free variables inside modules