

The ProvidePlugin makes a package available as a variable in every module compiled through webpack. Remember that lodash package we were using? For demonstration purposes, let's say we wanted to instead provide this as a global throughout our application. Before we do anything let's take another look at our project:

Let's start with the first use case of shimming global variables.

Please make sure you are familiar with the setup there before moving on. The following article will walk through both of these use cases.įor simplicity, this guide stems from the examples in Getting Started. In this case, you may only want to deliver those polyfills to the browsers that need patching (i.e. Please use these features only when necessary.Īnother instance where shimming can be useful is when you want to polyfill browser functionality to support more users. This means writing isolated modules that are well contained and do not rely on hidden dependencies (e.g. We don't recommend using globals! The whole concept behind webpack is to allow more modular front-end development. These "broken modules" are one instance where shimming comes into play. The libraries might also create globals which need to be exported. However, some third party libraries may expect global dependencies (e.g. The webpack compiler can understand modules written as ES2015 modules, CommonJS or AMD.
