Internal webpack plugins
This is a list of plugins which are used by webpack internally.
Categories of internal plugins:
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. The handler must have the signature function(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.
SingleEntryPlugin
SingleEntryPlugin(context, request, chunkName)
Adds an entry chunk on compilation. The chunk is named chunkName and contains only one module (plus dependencies). The module is resolved from request in context (absolute path).
PrefetchPlugin
PrefetchPlugin(context, request)
Prefetches request and dependencies to enable a more parallel compilation. It doesn't create any chunk. The module is resolved from request in context (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 library name of type type.
WebWorkerTemplatePlugin
webworker/WebWorkerTemplatePlugin(options)
Chunks are loaded by importScripts. Else it's similar to JsonpTemplatePlugin.
options are the output options.
EvalDevToolModulePlugin
Decorates the module template by wrapping each module in a eval 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. Adds module.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 that require.valueOf and require.onError are not processed by other plugins.
CompatibilityPlugin
Currently useless. Ensures compatibility with other module loaders.
ConstPlugin
Tries to evaluate expressions in if (...) statements and ternaries to replace them with true/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 by Terser
- 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';
const FOO = 1;
if (FOO === 0) {
// dead branch
calculateTax();
}In the above example, webpack is unable to prune the branch, but Terser does. However, if FOO is defined using DefinePlugin, webpack will succeed.
It is important to mention that import { calculateTax } from './tax'; will also get pruned because calculateTax() call was in the dead branch and got eliminated.
ProvidePlugin
ProvidePlugin(name, request)
If name is used in a module it is filled by a module loaded by require(<request>).
NodeStuffPlugin
NodeStuffPlugin(options, context)
Provide stuff that is normally available in Node.js modules.
It also ensures that module 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 is 0.0.0. requirejs.onError is mapped to require.onError.
NodeSourcePlugin
node/NodeSourcePlugin(options)
This module adds stuff from Node.js that is not available in non Node.js environments.
It adds polyfills for process, console, Buffer and global 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-style define and require to modules. Also bind require.amd, define.amd and webpack_amd_options## to the options passed as parameter.
CommonJsPlugin
dependencies/CommonJsPlugin
Provides CommonJs-style require to modules.
RequireContextPlugin
dependencies/RequireContextPlugin(modulesDirectories, extensions)
Provides require.context. The parameter modulesDirectories and extensions 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()
Provides require.ensure.
RequireIncludePlugin
dependencies/RequireIncludePlugin()
Provides require.include.
DefinePlugin
DefinePlugin(definitions)
Define constants for identifier.
definitions is an object.
optimize
LimitChunkCountPlugin
optimize/LimitChunkCountPlugin(options)
Merge chunks limit chunk count is lower than options.maxChunks.
The overhead for each chunks is provided by options.chunkOverhead or defaults to 10000. Entry chunks sizes are multiplied by options.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 of minChunkSize.
FlagIncludedChunksPlugin
optimize/FlagIncludedChunksPlugin()
Adds chunk ids of chunks which are included in the chunk. This eliminates unnecessary chunk loads.
RealContentHashPlugin
optimize/RealContentHashPlugin()
When optimization.realContentHash option is enabled, webpack will apply RealContentHashPlugin to compiler internally.
Hook
RealContentHashPlugin provides a updateHash 5.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
});
});