Merge branch 'master' into awesome-webpack

package.json

@@ -46,7 +46,7 @@
     "lint:markdown": "npm run lint-markdown *.md ./src/content/**/*.md",
     "lint-markdown": "markdownlint --config ./.markdownlint.json --ignore './src/content/**/_*.md' --ignore '.vale/**/*.md' --ignore '.github/**/*.md'",
     "lint:prose": "vale --config='.vale.ini' src/content",
-    "lint:links": "hyperlink -c 8 --root dist -r dist/index.html --canonicalroot https://webpack.js.org/ --internal --skip /plugins/extract-text-webpack-plugin/ --skip /printable --skip https:// --skip http:// --skip sw.js > internal-links.tap; cat internal-links.tap | tap-spot",
+    "lint:links": "hyperlink -c 8 --root dist -r dist/index.html --canonicalroot https://webpack.js.org/ --skip /plugins/extract-text-webpack-plugin/ --skip /printable --skip https:// --skip http:// --skip sw.js > internal-links.tap; cat internal-links.tap | tap-spot",
     "sitemap": "cd dist && sitemap-static --ignore-file=../sitemap-ignore.json --pretty --prefix=https://webpack.js.org/ > sitemap.xml",
     "serve": "npm run build && sirv start ./dist --port 4000",
     "preprintable": "npm run clean-printable",
@@ -103,7 +103,7 @@
     "husky": "^7.0.1",
     "hyperlink": "^4.6.1",
     "jest": "^27.0.6",
-    "lint-staged": "^11.1.1",
+    "lint-staged": "^11.1.2",
     "lodash": "^4.17.21",
     "markdownlint": "^0.23.1",
     "markdownlint-cli": "^0.28.1",
@@ -143,7 +143,7 @@
     "webpack-cli": "^4.7.2",
     "webpack-dev-server": "^4.0.0-rc.0",
     "webpack-merge": "^5.8.0",
-    "workbox-webpack-plugin": "^6.2.0"
+    "workbox-webpack-plugin": "^6.2.2"
   },
   "dependencies": {
     "@docsearch/react": "^3.0.0-alpha.39",
@@ -161,7 +161,7 @@
     "unist-util-visit": "^2.0.3",
     "webpack-pwa-manifest": "^4.3.0",
     "webpack.vote": "https://github.com/webpack/voting-app.git",
-    "workbox-window": "^6.2.0"
+    "workbox-window": "^6.2.2"
   },
   "resolutions": {
     "sitemap-static/minimist": "1.2.5",

src/content/configuration/experiments.mdx

@@ -8,7 +8,7 @@ contributors:
   - anshumanv
 ---
 
-## `experiments`
+## experiments
 
 `boolean: false`
 
@@ -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)
@@ -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.

src/content/configuration/index.mdx

@@ -22,15 +22,17 @@ contributors:
 
 Out of the box, webpack won't require you to use a configuration file. However, it will assume the entry point of your project is `src/index.js` and will output the result in `dist/main.js` minified and optimized for production.
 
+T> [createapp.dev](https://createapp.dev/webpack) is an online tool for creating custom webpack configuration. It allows you to select various features that will be combined and added to resulting configuration file. Also, it generates an example project based on provided webpack configuration that you can review in your browser and download.
+
 Usually your projects will need to extend this functionality, for this you can create a `webpack.config.js` file in the root folder and webpack will automatically use it.
 
 All the available configuration options are specified below.
 
 T> New to webpack? Check out our guide to some of webpack's [core concepts](/concepts) to get started!
 
-## Use different configuration file
+## Use a different configuration file
 
-If for some reason you want to use different configuration file depending on certain situations you can change this via command line by using the `--config` flag.
+If for some reason you want to use different configuration file depending on certain situations, you can change this via command line by using the `--config` flag.
 
 **package.json**
 
@@ -1170,4 +1172,4 @@ found 0 vulnerabilities
 Congratulations! Your new webpack configuration file has been created!
 ```
 
-[createapp.dev - create a webpack configuration in your browser](https://createapp.dev/webpack) is an online tool for creating custom webpack configuration. It allows you to select various features that will be combined and added to resulting configuration file. Also, it generates an example project based on provided webpack configuration that you can review in your browser and download.
+