This is a list of plugins which are used by webpack internally.

• environment
• compiler
• entry
• output
• source
• optimize

environment

Plugins affecting the environment of the compiler.

NodeEnvironmentPlugin

webpack.node.NodeEnvironmentPlugin()

Applies Node.js style filesystem to the compiler.

compiler

Plugins affecting the compiler

MemoryCachePlugin

MemoryCachePlugin()

Adds a cache to the compiler, where modules are cached in memory.

ProgressPlugin

ProgressPlugin(handler)

Hook into the compiler to extract progress information. Thehandler must have the signaturefunction(percentage, message). Percentage is called with a value between 0 and 1, where 0 indicates the start and 1 the end.

RecordIdsPlugin

RecordIdsPlugin()

Saves and restores module and chunk ids from records.

entry

Plugins, which add entry chunks to the compilation.

EntryPlugin

EntryPlugin(context, entry, options)

Adds an entry chunk on compilation. The chunk is namedoptions.name and contains only one module (plus dependencies). The module is resolved fromentry incontext (absolute path).

PrefetchPlugin

PrefetchPlugin(context, request)

Prefetchesrequest and dependencies to enable a more parallel compilation. It doesn't create any chunk. The module is resolved fromrequest incontext (absolute path).

output

JsonpTemplatePlugin

JsonpTemplatePlugin(options)

Chunks are wrapped into JSONP-calls. A loading algorithm is included in entry chunks. It loads chunks by adding a<script> tag.

options are the output options.

options.jsonpFunction is the JSONP function.

options.publicPath is used as path for loading the chunks.

options.chunkFilename is the filename under that chunks are expected.

NodeTemplatePlugin

node/NodeTemplatePlugin(options)

Chunks are wrapped into Node.js modules exporting the bundled modules. The entry chunks loads chunks by requiring them.

options are the output options.

options.chunkFilename is the filename under that chunks are expected.

LibraryTemplatePlugin

LibraryTemplatePlugin(name, target)

The entries chunks are decorated to form a libraryname of typetype.

WebWorkerTemplatePlugin

webworker/WebWorkerTemplatePlugin(options)

Chunks are loaded byimportScripts. Else it's similar toJsonpTemplatePlugin.

options are the output options.

EvalDevToolModulePlugin

Decorates the module template by wrapping each module in aeval annotated with// @sourceURL.

SourceMapDevToolPlugin

SourceMapDevToolPlugin(sourceMapFilename, sourceMappingURLComment, moduleFilenameTemplate, fallbackModuleFilenameTemplate)

Decorates the templates by generating a SourceMap for each chunk.

sourceMapFilename the filename template of the SourceMap.[hash],[name],[id],[file] and[filebase] are replaced. If this argument is missing, the SourceMap will be inlined as DataUrl.

HotModuleReplacementPlugin

HotModuleReplacementPlugin(options)

Add support for hot module replacement. Decorates the templates to add runtime code. Addsmodule.hot API.

options.hotUpdateChunkFilename the filename for hot update chunks.

options.hotUpdateMainFilename the filename for the hot update manifest.

options.hotUpdateFunction JSON function name for the hot update.

source

Plugins affecting the source code of modules.

APIPlugin

Make webpack_public_path, webpack_require, webpack_modules and webpack_chunk_load accessible. Ensures thatrequire.valueOf andrequire.onError are not processed by other plugins.

CompatibilityPlugin

Currently useless. Ensures compatibility with other module loaders.

ConstPlugin

Tries to evaluate expressions inif (...) statements and ternaries to replace them withtrue/false for further possible dead branch elimination using hooks fired by the parser.

There are multiple optimizations in production mode regarding dead branches:

• The ones performed byTerser
• The ones performed by webpack

Webpack will try to evaluate conditional statements. If it succeeds then the dead branch is removed. Webpack can't do constant folding unless the compiler knows it. For example:

import{ calculateTax}from'./tax';constFOO=1;if(FOO===0){// dead branchcalculateTax();}

In the above example, webpack is unable to prune the branch, but Terser does. However, ifFOO is defined usingDefinePlugin, webpack will succeed.

It is important to mention thatimport { calculateTax } from './tax'; will also get pruned becausecalculateTax() call was in the dead branch and got eliminated.

ProvidePlugin

ProvidePlugin(name, request)

Ifname is used in a module it is filled by a module loaded byrequire(<request>).

NodeStuffPlugin

NodeStuffPlugin(options, context)

Provide stuff that is normally available in Node.js modules.

It also ensures thatmodule is filled with some Node.js stuff if you use it.

RequireJsStuffPlugin

Provide stuff that is normally available in require.js.

require[js].config is removed.require.version is0.0.0.requirejs.onError is mapped torequire.onError.

NodeSourcePlugin

node/NodeSourcePlugin(options)

This module adds stuff from Node.js that is not available in non Node.js environments.

It adds polyfills forprocess,console,Buffer andglobal if used. It also binds the built in Node.js replacement modules.

NodeTargetPlugin

node/NodeTargetPlugin()

The plugins should be used if you run the bundle in a Node.js environment.

If ensures that native modules are loaded correctly even if bundled.

AMDPlugin

dependencies/AMDPlugin(options)

Provides AMD-styledefine andrequire to modules. Also bindrequire.amd,define.amd and webpack_amd_options## to theoptions passed as parameter.

CommonJsPlugin

dependencies/CommonJsPlugin

Provides CommonJs-stylerequire to modules.

RequireContextPlugin

dependencies/RequireContextPlugin(modulesDirectories, extensions)

Providesrequire.context. The parametermodulesDirectories andextensions are used to find alternative requests for files. It's useful to provide the same arrays as you provide to the resolver.

RequireEnsurePlugin

dependencies/RequireEnsurePlugin()

Providesrequire.ensure.

RequireIncludePlugin

dependencies/RequireIncludePlugin()

Providesrequire.include.

DefinePlugin

DefinePlugin(definitions)

Define constants for identifier.

definitions is an object.

optimize

Note that all plugins underwebpack.optimize namespace should only be used whenmode set to'none'. Otherwise you might get into trouble where plugins are applied twice.

LimitChunkCountPlugin

optimize/LimitChunkCountPlugin(options)

Merge chunks limit chunk count is lower thanoptions.maxChunks.

The overhead for each chunks is provided byoptions.chunkOverhead or defaults to 10000. Entry chunks sizes are multiplied byoptions.entryChunkMultiplicator (or 10).

Chunks that reduce the total size the most are merged first. If multiple combinations are equal the minimal merged size wins.

MergeDuplicateChunksPlugin

optimize/MergeDuplicateChunksPlugin()

Chunks with the same modules are merged.

RemoveEmptyChunksPlugin

optimize/RemoveEmptyChunksPlugin()

Modules that are included in every parent chunk are removed from the chunk.

MinChunkSizePlugin

optimize/MinChunkSizePlugin(minChunkSize)

Merges chunks until each chunk has the minimum size ofminChunkSize.

ModuleConcatenationPlugin

See theModuleConcatenationPlugin page for details.

FlagIncludedChunksPlugin

optimize/FlagIncludedChunksPlugin()

Adds chunk ids of chunks which are included in the chunk. This eliminates unnecessary chunk loads.

RealContentHashPlugin

optimize/RealContentHashPlugin()

Whenoptimization.realContentHash option is enabled, webpack will applyRealContentHashPlugin to compiler internally.

Hook

RealContentHashPlugin provides aupdateHash5.8.0+ hook for customizing hash updating:

const webpack=require('webpack');const RealContentHashPlugin= webpack.optimize.RealContentHashPlugin;// ...compiler.hooks.compilation.tap('MyPlugin',(compilation)=>{const hooks= RealContentHashPlugin.getCompilationHooks(compilation);  hooks.updateHash.tap('MyPlugin',(content, oldHash)=>{// you can calculate the hash here as you wish});});

5 Contributors