Skip to content

docs(configuration): document buildHttp #5276

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
Merged
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
93 changes: 89 additions & 4 deletions src/content/configuration/experiments.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ contributors:
- anshumanv
---

## `experiments`
## experiments

`boolean: false`

Expand All @@ -19,6 +19,7 @@ W> Because experimental features have relaxed semantic versioning and might cont
Available options:

- `asyncWebAssembly`: Support the new WebAssembly according to the [updated specification](https://github.com/WebAssembly/esm-integration), it makes a WebAssembly module an async module.
- [`buildHttp`](#experimentsbuildhttp)
- [`executeModule`](#experimentsexecutemodule)
- `layers`: Enable module and chunk layers.
- [`lazyCompilation`](#experimentslazycompilation)
Expand All @@ -32,17 +33,101 @@ Available options:
module.exports = {
//...
experiments: {
asyncWebAssembly: true,
buildHttp: true,
executeModule: true,
layers: true,
lazyCompilation: true,
outputModule: true,
syncWebAssembly: true,
topLevelAwait: true,
asyncWebAssembly: true,
layers: true,
lazyCompilation: true,
},
};
```

### experiments.buildHttp

When enabled, webpack can build remote resources that begin with the `http(s):` protocol.

- Type:

One of the following:

- `boolean`
- `HttpUriOptions`
```ts
{
cacheLocation?: false | string,
frozen?: boolean,
lockfileLocation?: string,
upgrade?: boolean
}
```

- Available: 5.49.0+
- Example

```javascript
// webpack.config.js
module.exports = {
//...
experiments: {
buildHttp: true,
},
};
```

```js
// src/index.js
import pMap1 from 'https://cdn.skypack.dev/p-map';
// with `buildHttp` enabled, webpack will build pMap1 just like a regular local module
console.log(pMap1);
```

#### experiments.buildHttp.cacheLocation

Define the location for caching remote resources.

- Type
- `string`
- `false`
- Example
```javascript
// webpack.config.js
module.exports = {
//...
experiments: {
buildHttp: {
cacheLocation: false,
},
},
};
```

By default webpack would use `<compiler-name.>webpack.lock.data/` for caching, but you can disable it by setting its value to `false`.

Note that you should commit files under `experiments.buildHttp.cacheLocation` into a version control system as no network requests will be made during the `production` build.

#### experiments.buildHttp.frozen

Freeze the remote resources and lockfile. Any modification to the lockfile or resource contents will result in an error.

- Type: `boolean`

#### experiments.buildHttp.lockfileLocation

Define the location to store the lockfile.

- Type: `string`

By default webpack would generate a `<compiler-name.>webpack.lock` file>. Make sure to commit it into a version control system. During the `production` build, webpack will build those modules beginning with `http(s):` protocol from the lockfile and caches under [`experiments.buildHttp.cacheLocation`](#experimentsbuildhttpcachelocation).

#### experiments.buildHttp.upgrade

Detect changes to remote resources and upgrade them automatically.

- Type: `boolean`

### experiments.executeModule

Enable execution of modules from the module graph for plugins and loaders at build time to generate code or other assets.
Expand Down