Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 4 additions & 4 deletions src/content/api/cli.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -49,7 +49,7 @@ webpack-cli offers a variety of commands to make working with webpack easier. By
| [`help`](#help) | `help\|h [command] [option]` | Display help for commands and options. |
| [`info`](#info) | `info\|i [options]` | Outputs information about your system. |
| [`serve`](#serve) | `serve\|server\|s [options]` | Run the `webpack-dev-server`. |
| [`version`](#version) | `version\|v [commands...]` | Output the version number of 'webpack', 'webpack-cli' and 'webpack-dev-server' and other packages. |
| [`version`](#version) | `version\|v [options]` | Output the version number of 'webpack', 'webpack-cli' and 'webpack-dev-server' and other packages. |
| [`watch`](#watch) | `watch\|w [entries...] [options]` | Run webpack and watch for files changes. |

### Build
Expand Down Expand Up @@ -176,7 +176,7 @@ npx webpack info [options]
**example**

```bash
npx webpack info --output json --addition-package postcss
npx webpack info --output json --additional-package postcss
```

#### Options for info
Expand Down Expand Up @@ -621,11 +621,11 @@ npx webpack --config-node-env production # process.env.NODE_ENV = 'production'

When the `mode` option is not specified in the configuration, you can use the `--config-node-env` option to set the `mode`. For example, using `--config-node-env production` will set both `process.env.NODE_ENV` and `mode` to `'production'`.

If your configuration exports a function, the value of `--config-node-env` is assigned to mode after the function returns. This means that `mode` will not be available in the function arguments (`env` and `argv`). However, the value of `--config-node-env` is accessible as `argv.nodeEnv` within the function and can be used accordingly.
If your configuration exports a function, the value of `--config-node-env` is assigned to mode after the function returns. This means that `mode` will not be available in the function arguments (`env` and `argv`). However, the value of `--config-node-env` is accessible as `argv.configNodeEnv` within the function and can be used accordingly.

```js
export default (env, argv) => {
console.log(argv.defineProcessEnvNodeEnv); // 'production' if --config-node-env production is used
console.log(argv.configNodeEnv); // 'production' if --config-node-env production is used
return {
// your configuration
};
Expand Down
28 changes: 19 additions & 9 deletions src/content/api/compilation-hooks.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@ compilation of all the modules in the dependency graph of an application.
During the compilation phase, modules are loaded, sealed, optimized, chunked,
hashed and restored.

The `Compilation` class also extends `Tapable` and provides the following
The `Compilation` class also exposes a `hooks` object of tapable hooks and provides the following
lifecycle hooks. They can be tapped the same way as compiler hooks:

```js
Expand Down Expand Up @@ -84,7 +84,7 @@ Called when all modules have been built without errors.

## finishRebuildingModule

`SyncHook`
`AsyncSeriesHook`

Executed when a module has been rebuilt, in case of both success or with errors.

Expand Down Expand Up @@ -159,15 +159,15 @@ Called after modules optimization has completed.

Called at the beginning of the chunk optimization phase. A plugin can tap into this hook to perform optimizations on chunks.

- Callback Parameters: `chunks`
- Callback Parameters: `chunks` `chunkGroups`

## afterOptimizeChunks

`SyncHook`

Fired after chunk optimization has completed.

- Callback Parameters: `chunks`
- Callback Parameters: `chunks` `chunkGroups`

## optimizeTree

Expand All @@ -187,7 +187,7 @@ Called after the dependency tree optimization has completed with success.

## optimizeChunkModules

`SyncBailHook`
`AsyncSeriesBailHook`

Called after the tree optimization, at the beginning of the chunk modules optimization. A plugin can tap into this hook to perform optimizations of chunk modules.

Expand All @@ -205,7 +205,7 @@ Called after the chunkmodules optimization has completed successfully.

`SyncBailHook`

Called to determine whether or not to store records. Returning anything `!== false` will prevent every other "record" hook from being executed ([`record`](#record), [`recordModules`](#recordmodules), [`recordChunks`](#recordchunks) and [`recordHash`](#recordhash)).
Called to determine whether or not to store records. Returning `false` prevents the "record" hooks from being executed ([`record`](#record), [`recordModules`](#recordmodules), [`recordChunks`](#recordchunks) and [`recordHash`](#recordhash)); any other value allows them.

## reviveModules

Expand Down Expand Up @@ -347,7 +347,7 @@ Called before modules are hashed.

## afterModuleHash

`syncHook`
`SyncHook`

Called after modules are hashed.

Expand Down Expand Up @@ -638,7 +638,9 @@ Executed right after `needAdditionalSeal`.

Triggered to emit the hash for each chunk.

- Callback Parameters: `chunk` `chunkHash`
- Callback Parameters: `chunk` `chunkHash` `context`

`context` is a `ChunkHashContext` holding `chunkGraph`, `moduleGraph`, `runtimeTemplate` and `codeGenerationResults`.

## moduleAsset

Expand All @@ -662,7 +664,7 @@ Triggered when an asset from a chunk was added to the compilation.

Called to determine the path of an asset.

- Callback Parameters: `path` `options`
- Callback Parameters: `path` `options` `assetInfo`

## needAdditionalPass

Expand All @@ -678,6 +680,14 @@ Executed after setting up a child compiler.

- Callback Parameters: `childCompiler` `compilerName` `compilerIndex`

## log

`SyncBailHook`

Allows to log into [stats](/configuration/stats/) when enabled, see [`stats.logging`, `stats.loggingDebug` and `stats.loggingTrace` options](/configuration/infrastructureLogging/).

- Callback Parameters: `origin`, `logEntry`

## normalModuleLoader

Since webpack v5 `normalModuleLoader` hook was removed. Now to access the loader use `NormalModule.getCompilationHooks(compilation).loader` instead.
Expand Down
36 changes: 10 additions & 26 deletions src/content/api/compilation-object.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -42,26 +42,24 @@ Parameters:

### findModule

`function (module)`
`function (identifier)`

Attempts to search for a module by its identifier.
Attempts to search for a module by its identifier. Returns the module, or `undefined` if none matches.

Parameters:

- `module` - module to be searched for. The identifier is extracted from the module by the compilation using `module.identifier()` method.
- `identifier` - the identifier string of the module to be searched for.

### buildModule

`function (module, optional, origin, dependencies)`
`function (module, callback)`

Builds the given module.

Parameters:

- `module` - the module to be built.
- `optional` - optional flag.
- `origin` - origin module from which this module build was requested.
- `dependencies` - optional dependencies of the module to be built.
- `callback` - invoked as `callback(err, module)` when the build finishes.

### processModuleDependencies

Expand Down Expand Up @@ -124,10 +122,6 @@ Parameters:

Unseals the compilation.

Parameters:

- `callback` - function to be invoked when the compilation has been unsealed.

### reportDependencyErrorsAndWarnings

`function (module, blocks)`
Expand Down Expand Up @@ -172,26 +166,16 @@ Parameters:

- `module` - the module to assign depth to.

### getDependencyReference

`function (module, dependency)`

Returns the reference to the dependency from a given module.

Parameters:

- `module` - the module at question.
- `dependency` - the dependency to get reference to.

### processDependenciesBlocksForChunkGroups
### getDependencyReferencedExports

`function (inputChunkGroups)`
`function (dependency, runtime)`

Creates the `Chunk` graph from the `Module` graph. The process is done in two phases. Phase one: traverse the module graph and build a basic chunks graph in `chunkDependencies`. Phase two: traverse every possible way through the basic chunk graph and track the available modules. While traversing, `processDependenciesBlocksForChunkGroups` connects chunks with each other and `Blocks` with `Chunks`. It stops traversing when all modules for a chunk are already available and it doesn't connect unneeded chunks.
Returns the exports referenced by the given dependency.

Parameters:

- `inputChunkGroups` - chunk groups that are processed.
- `dependency` - the dependency to get the referenced exports of.
- `runtime` - the runtime to get them for.

### removeReasonsOfDependencyBlock

Expand Down
12 changes: 2 additions & 10 deletions src/content/api/compiler-hooks.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -14,8 +14,8 @@ contributors:
---

The `Compiler` module is the main engine that creates a compilation instance
with all the options passed through the [CLI](/api/cli) or [Node API](/api/node). It extends the
`Tapable` class in order to register and call plugins. Most user-facing plugins
with all the options passed through the [CLI](/api/cli) or [Node API](/api/node). It exposes a
`hooks` object of [tapable](https://github.com/webpack/tapable) hooks (`SyncHook`, `AsyncSeriesHook`, …) used to register plugins. Most user-facing plugins
are first registered on the `Compiler`.

When developing a plugin for webpack, you might want to know where each hook is called. To learn this, search for `hooks.<hook name>.call` across the webpack source.
Expand Down Expand Up @@ -323,11 +323,3 @@ Called when the compiler is closing.
Allows to use infrastructure logging when enabled in the configuration via [`infrastructureLogging` option](/configuration/infrastructureLogging/).

- Callback Parameters: `name`, `type`, `args`

### log

`SyncBailHook`

Allows to log into [stats](/configuration/stats/) when enabled, see [`stats.logging`, `stats.loggingDebug` and `stats.loggingTrace` options](/configuration/infrastructureLogging/).

- Callback Parameters: `origin`, `logEntry`
6 changes: 3 additions & 3 deletions src/content/api/contextmodulefactory-hooks.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ contributors:

The `ContextModuleFactory` module is used by the `Compiler` to generate dependencies from webpack specific [require.context](/api/module-methods/#requirecontext) API. It resolves the requested directory, generates requests for each file and filters against passed regExp. Matching dependencies then passes through [NormalModuleFactory](/api/normalmodulefactory-hooks).

The `ContextModuleFactory` class extends `Tapable` and provides the following
The `ContextModuleFactory` class exposes a `hooks` object of tapable hooks and provides the following
lifecycle hooks. They can be tapped the same way as compiler hooks:

```js
Expand Down Expand Up @@ -46,6 +46,6 @@ Called after directory contents are read. On recursive mode, calls for each sub-

`AsyncSeriesWaterfallHook`

Called for each file after the request is created but before filtering against regExp.
Called once per directory with the array of generated `{ context, request }` alternatives, before filtering against regExp. Return the (possibly modified) array.

- Callback Parameters: `request` `options`
- Callback Parameters: `modules` `options`
8 changes: 4 additions & 4 deletions src/content/api/hot-module-replacement.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -327,19 +327,19 @@ The `info` parameter will be an object containing some of the following values:
{
type: 'self-declined' | 'declined' |
'unaccepted' | 'accepted' |
'disposed' | 'accept-errored' |
'disposed' | 'accept-errored' | 'accept-error-handler-errored' |
'self-accept-errored' | 'self-accept-error-handler-errored',
moduleId: 4, // The module in question.
dependencyId: 3, // For errors: the module id owning the accept handler.
dependencyId: 3, // For errors: the id of the updated dependency whose accept handler threw (`moduleId` is the module owning the handler).
chain: [1, 2, 3, 4], // For declined/accepted/unaccepted: the chain from where the update was propagated.
parentId: 5, // For declined: the module id of the declining parent
outdatedModules: [1, 2, 3, 4], // For accepted: the modules that are outdated and will be disposed
outdatedDependencies: { // For accepted: The location of accept handlers that will handle the update
5: [4]
},
error: new Error(...), // For errors: the thrown error
originalError: new Error(...) // For self-accept-error-handler-errored:
// the error thrown by the module before the error handler tried to handle it.
originalError: new Error(...) // For accept-error-handler-errored and self-accept-error-handler-errored:
// the error thrown by the accept handler or the module before the error handler tried to handle it.
}
```

Expand Down
39 changes: 23 additions & 16 deletions src/content/api/loaders.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -264,7 +264,7 @@ this.callback(
1. The first argument must be an `Error` or `null`
2. The second argument is a `string` or a [`Buffer`](https://nodejs.org/api/buffer.html).
3. Optional: The third argument must be a source map that is parsable by [this module](https://github.com/mozilla/source-map).
4. Optional: The fourth option, ignored by webpack, can be anything (e.g. some metadata).
4. Optional: The fourth argument (`meta`) can be anything (e.g. some metadata). webpack only reads `meta.webpackAST` and uses it as the pre-parsed AST; everything else is passed on to the next loader.

T> It can be useful to pass an abstract syntax tree (AST), like [`ESTree`](https://github.com/estree/estree), as the fourth argument (`meta`) to speed up the build time if you want to share common ASTs between loaders.

Expand Down Expand Up @@ -308,10 +308,10 @@ T> Unlike throwing an Error directly, it will NOT interrupt the compilation proc
### this.emitFile

```ts
emitFile(name: string, content: Buffer|string, sourceMap: {...})
emitFile(name: string, content: Buffer|string, sourceMap: {...}, assetInfo?: AssetInfo)
```

Emit a file. This is webpack-specific.
Emit a file. This is webpack-specific. The optional `assetInfo` is stored as the asset's info in `buildInfo.assetsInfo`.

### this.emitWarning

Expand Down Expand Up @@ -443,6 +443,7 @@ An alternative lightweight solution for the child compiler to compile and execut

- `request`: the request string to load the module from
- `options`:
- `baseUri`: the base URI used for the built modules <Badge text="5.70.0+" />
- `layer`: specify a layer in which this module is placed/compiled
- `publicPath`: the public path used for the built modules
- `callback`: an optional Node.js style callback returning the exports of the module or a namespace object for ESM. `importModule` will return a Promise if no callback is provided.
Expand Down Expand Up @@ -525,7 +526,21 @@ Resolves the given request to a module, applies all configured loaders and calls
An array of all the loaders. It is writable in the pitch phase.

```ts
loaders = [{request: string, path: string, query: string, module: function}]
loaders = [{
request: string,
path: string,
query: string,
fragment: string,
options: object | string | undefined,
ident: string,
normal: function | undefined,
pitch: function | undefined,
raw: boolean | undefined,
data: object | undefined,
pitchExecuted: boolean,
normalExecuted: boolean,
type?: 'commonjs' | 'module'
}]
```

In [the example](#example-for-the-loader-context):
Expand All @@ -536,13 +551,13 @@ In [the example](#example-for-the-loader-context):
request: "/abc/loader1.js?xyz",
path: "/abc/loader1.js",
query: "?xyz",
module: [Function],
normal: [Function],
},
{
request: "/abc/node_modules/loader2/index.js",
path: "/abc/node_modules/loader2/index.js",
query: "",
module: [Function],
normal: [Function],
},
];
```
Expand Down Expand Up @@ -671,19 +686,11 @@ W> The usage of these properties is highly discouraged since we are planning to

### this.debug

A boolean flag. It is set when in debug mode.

### this.inputValue

Passed from the last loader. If you would execute the input argument as a module, consider reading this variable for a shortcut (for performance).
No longer set by webpack. It is only set when `LoaderOptionsPlugin` is configured with a `debug` option, which copies the option onto the loader context.

### this.minimize

Tells if result should be minimized.

### this.value

Pass values to the next loader. If you know what your result exports if executed as a module, set this value here (as an only element array).
No longer set by webpack. It is only set when `LoaderOptionsPlugin` is configured with a `minimize` option, which copies the option onto the loader context.

### this.\_module

Expand Down
Loading
Loading