Plugins in Webpack

Webpack performs a narrow range of tasks. To expand the capabilities, you need to install and connect additional plugins.

Let's look at the general algorithm for installing and connecting plugins. Let's assume that we have some imaginary plugin test-webpack-plugin for this. Let's look at working with plugins using its example (the code below is just a diagram, since there is no such plugin in reality).

So, first you need to install the plugin via npm:

npm install test-webpack-plugin --save-dev

After this, the plugin needs to be imported to the configuration file:

import TestWebpackPlugin from 'test-webpack-plugin';

Then this plugin needs to be called in the plugins setting:

export default {
	entry: './src/index.js',
	plugins: [new TestWebpackPlugin()],
};

The plugins setting may contain not one, but several plugins:

export default {
	entry: './src/index.js',
	plugins: [
		new TestWebpackPlugin1(),
		new TestWebpackPlugin2()
	],
};