webpack Loaders & Plugins


Loaders and plugins make up the building blocks of Webpack.

Loaders are typically delegated to a single task and file type. They are easier to setup and usually require less boilerplate code.

Plugins, on the other hand, have access to Webpack's internal build system via hooks, and are therefore more powerful. Plugins can modify the fully configured Webpack environment, and they can perform custom actions throughout the compilation process.

When dealing with our CSS files, for example, a loader might be used to automatically add vendor prefixes to properties, while a plugin might be used to produce a minified stylesheet in the bundler build process.