Merge tag 'v4.30.0' into next

4.30.0
This commit is contained in:
Tobias Koppers 2019-05-09 21:34:28 +02:00
commit b66143f706
145 changed files with 3679 additions and 4410 deletions

2
declarations.d.ts vendored
View File

@ -352,7 +352,7 @@ declare const $publicPath$;
declare const __webpack_require__;
declare const $hotChunkFilename$;
declare const $hotMainFilename$;
declare const WebAssembly;
declare namespace WebAssembly {}
declare const importScripts;
declare const $crossOriginLoading$;
declare const chunkId;

View File

@ -268,11 +268,13 @@ export type FilterItemTypes = RegExp | string | Function;
export interface WebpackOptions {
/**
* Set the value of `require.amd` and `define.amd`.
* Set the value of `require.amd` and `define.amd`. Or disable AMD support.
*/
amd?: {
[k: string]: any;
};
amd?:
| false
| {
[k: string]: any;
};
/**
* Report the first error as a hard error instead of tolerating it.
*/
@ -1176,7 +1178,8 @@ export interface OutputOptions {
| "amd-require"
| "umd"
| "umd2"
| "jsonp";
| "jsonp"
| "system";
/**
* The output directory as **absolute path** (required).
*/

View File

@ -1,6 +1,6 @@
# pageA.js
``` javascript
```javascript
require(["./common"], function(common) {
common(require("./a"));
});
@ -8,7 +8,7 @@ require(["./common"], function(common) {
# pageB.js
``` javascript
```javascript
require(["./common"], function(common) {
common(require("./b"));
});
@ -16,7 +16,7 @@ require(["./common"], function(common) {
# pageC.js
``` javascript
```javascript
require(["./a"], function(a) {
console.log(a + require("./b"));
});
@ -28,7 +28,7 @@ a big file...
# webpack.config.js
``` javascript
```javascript
var path = require("path");
var AggressiveMergingPlugin = require("../../lib/optimize/AggressiveMergingPlugin");
module.exports = {
@ -60,56 +60,56 @@ module.exports = {
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
324.chunk.js 548 bytes {324} [emitted]
864.chunk.js 6.19 KiB {864} [emitted]
pageA.bundle.js 7.53 KiB {641} [emitted] pageA
pageB.bundle.js 7.54 KiB {791} [emitted] pageB
pageC.bundle.js 7.53 KiB {42} [emitted] pageC
394.chunk.js 548 bytes {394} [emitted]
456.chunk.js 6.19 KiB {456} [emitted]
pageA.bundle.js 7.51 KiB {424} [emitted] pageA
pageB.bundle.js 7.52 KiB {121} [emitted] pageB
pageC.bundle.js 7.51 KiB {178} [emitted] pageC
Entrypoint pageA = pageA.bundle.js
Entrypoint pageB = pageB.bundle.js
Entrypoint pageC = pageC.bundle.js
chunk {42} pageC.bundle.js (pageC) 68 bytes (javascript) 3.65 KiB (runtime) [entry] [rendered]
> ./pageC pageC
[2] ./pageC.js 68 bytes {42} [built]
[used exports unknown]
entry ./pageC pageC
+ 4 hidden chunk modules
chunk {324} 324.chunk.js 42 bytes [rendered]
> ./a [2] ./pageC.js 1:0-3:2
[4] ./a.js 21 bytes {324} {864} [built]
[used exports unknown]
cjs require ./a [0] ./pageA.js 2:8-22
amd require ./a [2] ./pageC.js 1:0-3:2
[5] ./b.js 21 bytes {324} {864} [built]
[used exports unknown]
cjs require ./b [1] ./pageB.js 2:8-22
cjs require ./b [2] ./pageC.js 2:17-31
chunk {641} pageA.bundle.js (pageA) 69 bytes (javascript) 3.65 KiB (runtime) [entry] [rendered]
> ./pageA pageA
[0] ./pageA.js 69 bytes {641} [built]
[used exports unknown]
entry ./pageA pageA
+ 4 hidden chunk modules
chunk {791} pageB.bundle.js (pageB) 69 bytes (javascript) 3.65 KiB (runtime) [entry] [rendered]
chunk {121} pageB.bundle.js (pageB) 69 bytes (javascript) 3.64 KiB (runtime) [entry] [rendered]
> ./pageB pageB
[1] ./pageB.js 69 bytes {791} [built]
[1] ./pageB.js 69 bytes {121} [built]
[used exports unknown]
entry ./pageB pageB
+ 4 hidden chunk modules
chunk {864} 864.chunk.js 5.45 KiB [rendered]
> ./common [0] ./pageA.js 1:0-3:2
> ./common [1] ./pageB.js 1:0-3:2
[3] ./common.js 5.41 KiB {864} [built]
chunk {178} pageC.bundle.js (pageC) 68 bytes (javascript) 3.64 KiB (runtime) [entry] [rendered]
> ./pageC pageC
[2] ./pageC.js 68 bytes {178} [built]
[used exports unknown]
amd require ./common [0] ./pageA.js 1:0-3:2
amd require ./common [1] ./pageB.js 1:0-3:2
[4] ./a.js 21 bytes {324} {864} [built]
entry ./pageC pageC
+ 4 hidden chunk modules
chunk {394} 394.chunk.js 42 bytes [rendered]
> ./a [2] ./pageC.js 1:0-3:2
[4] ./a.js 21 bytes {394} {456} [built]
[used exports unknown]
cjs require ./a [0] ./pageA.js 2:8-22
amd require ./a [2] ./pageC.js 1:0-3:2
[5] ./b.js 21 bytes {324} {864} [built]
[5] ./b.js 21 bytes {394} {456} [built]
[used exports unknown]
cjs require ./b [1] ./pageB.js 2:8-22
cjs require ./b [2] ./pageC.js 2:17-31
chunk {424} pageA.bundle.js (pageA) 69 bytes (javascript) 3.64 KiB (runtime) [entry] [rendered]
> ./pageA pageA
[0] ./pageA.js 69 bytes {424} [built]
[used exports unknown]
entry ./pageA pageA
+ 4 hidden chunk modules
chunk {456} 456.chunk.js 5.45 KiB [rendered]
> ./common [0] ./pageA.js 1:0-3:2
> ./common [1] ./pageB.js 1:0-3:2
[3] ./common.js 5.41 KiB {456} [built]
[used exports unknown]
amd require ./common [0] ./pageA.js 1:0-3:2
amd require ./common [1] ./pageB.js 1:0-3:2
[4] ./a.js 21 bytes {394} {456} [built]
[used exports unknown]
cjs require ./a [0] ./pageA.js 2:8-22
amd require ./a [2] ./pageC.js 1:0-3:2
[5] ./b.js 21 bytes {394} {456} [built]
[used exports unknown]
cjs require ./b [1] ./pageB.js 2:8-22
cjs require ./b [2] ./pageC.js 2:17-31
@ -119,49 +119,49 @@ chunk {864} 864.chunk.js 5.45 KiB [rendered]
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
324.chunk.js 123 bytes {324} [emitted]
864.chunk.js 182 bytes {324}, {864} [emitted]
pageA.bundle.js 1.42 KiB {641} [emitted] pageA
pageB.bundle.js 1.42 KiB {791} [emitted] pageB
pageC.bundle.js 1.43 KiB {42} [emitted] pageC
394.chunk.js 124 bytes {394} [emitted]
456.chunk.js 183 bytes {394}, {456} [emitted]
pageA.bundle.js 1.42 KiB {424} [emitted] pageA
pageB.bundle.js 1.42 KiB {121} [emitted] pageB
pageC.bundle.js 1.44 KiB {178} [emitted] pageC
Entrypoint pageA = pageA.bundle.js
Entrypoint pageB = pageB.bundle.js
Entrypoint pageC = pageC.bundle.js
chunk {42} pageC.bundle.js (pageC) 68 bytes (javascript) 3.65 KiB (runtime) [entry] [rendered]
> ./pageC pageC
[912] ./pageC.js 68 bytes {42} [built]
entry ./pageC pageC
+ 4 hidden chunk modules
chunk {324} 324.chunk.js 42 bytes [rendered]
> ./a [912] ./pageC.js 1:0-3:2
[21] ./b.js 21 bytes {324} {864} [built]
cjs require ./b [912] ./pageC.js 2:17-31
cjs require ./b [954] ./pageB.js 2:8-22
[162] ./a.js 21 bytes {324} {864} [built]
amd require ./a [912] ./pageC.js 1:0-3:2
cjs require ./a [953] ./pageA.js 2:8-22
chunk {641} pageA.bundle.js (pageA) 69 bytes (javascript) 3.65 KiB (runtime) [entry] [rendered]
> ./pageA pageA
[953] ./pageA.js 69 bytes {641} [built]
entry ./pageA pageA
+ 4 hidden chunk modules
chunk {791} pageB.bundle.js (pageB) 69 bytes (javascript) 3.65 KiB (runtime) [entry] [rendered]
chunk {121} pageB.bundle.js (pageB) 69 bytes (javascript) 3.64 KiB (runtime) [entry] [rendered]
> ./pageB pageB
[954] ./pageB.js 69 bytes {791} [built]
[588] ./pageB.js 69 bytes {121} [built]
entry ./pageB pageB
+ 4 hidden chunk modules
chunk {864} 864.chunk.js 5.45 KiB [rendered]
> ./common [953] ./pageA.js 1:0-3:2
> ./common [954] ./pageB.js 1:0-3:2
[21] ./b.js 21 bytes {324} {864} [built]
cjs require ./b [912] ./pageC.js 2:17-31
cjs require ./b [954] ./pageB.js 2:8-22
[162] ./a.js 21 bytes {324} {864} [built]
amd require ./a [912] ./pageC.js 1:0-3:2
cjs require ./a [953] ./pageA.js 2:8-22
[280] ./common.js 5.41 KiB {864} [built]
amd require ./common [953] ./pageA.js 1:0-3:2
amd require ./common [954] ./pageB.js 1:0-3:2
chunk {178} pageC.bundle.js (pageC) 68 bytes (javascript) 3.64 KiB (runtime) [entry] [rendered]
> ./pageC pageC
[145] ./pageC.js 68 bytes {178} [built]
entry ./pageC pageC
+ 4 hidden chunk modules
chunk {394} 394.chunk.js 42 bytes [rendered]
> ./a [145] ./pageC.js 1:0-3:2
[847] ./a.js 21 bytes {394} {456} [built]
amd require ./a [145] ./pageC.js 1:0-3:2
cjs require ./a [366] ./pageA.js 2:8-22
[996] ./b.js 21 bytes {394} {456} [built]
cjs require ./b [145] ./pageC.js 2:17-31
cjs require ./b [588] ./pageB.js 2:8-22
chunk {424} pageA.bundle.js (pageA) 69 bytes (javascript) 3.64 KiB (runtime) [entry] [rendered]
> ./pageA pageA
[366] ./pageA.js 69 bytes {424} [built]
entry ./pageA pageA
+ 4 hidden chunk modules
chunk {456} 456.chunk.js 5.45 KiB [rendered]
> ./common [366] ./pageA.js 1:0-3:2
> ./common [588] ./pageB.js 1:0-3:2
[543] ./common.js 5.41 KiB {456} [built]
amd require ./common [366] ./pageA.js 1:0-3:2
amd require ./common [588] ./pageB.js 1:0-3:2
[847] ./a.js 21 bytes {394} {456} [built]
amd require ./a [145] ./pageC.js 1:0-3:2
cjs require ./a [366] ./pageA.js 2:8-22
[996] ./b.js 21 bytes {394} {456} [built]
cjs require ./b [145] ./pageC.js 2:17-31
cjs require ./b [588] ./pageB.js 2:8-22
```

View File

@ -1,19 +1,19 @@
# pageA.js
``` javascript
{{pageA.js}}
```javascript
_{{pageA.js}}_
```
# pageB.js
``` javascript
{{pageB.js}}
```javascript
_{{pageB.js}}_
```
# pageC.js
``` javascript
{{pageC.js}}
```javascript
_{{pageC.js}}_
```
# common.js
@ -22,8 +22,8 @@ a big file...
# webpack.config.js
``` javascript
{{webpack.config.js}}
```javascript
_{{webpack.config.js}}_
```
# Info
@ -31,11 +31,11 @@ a big file...
## Unoptimized
```
{{stdout}}
_{{stdout}}_
```
## Production mode
```
{{production:stdout}}
_{{production:stdout}}_
```

View File

@ -26,6 +26,13 @@ const doCompileAndReplace = (args, prefix, callback) => {
if(fs.existsSync("dist"))
for(const file of fs.readdirSync("dist"))
fs.unlinkSync(`dist/${file}`);
try {
require.resolve("webpack-cli");
} catch (e) {
throw new Error("Please install webpack-cli at root.");
}
cp.exec(`node ${path.resolve(__dirname, "../bin/webpack.js")} ${args} ${displayReasons} ${commonArgs}`, (error, stdout, stderr) => {
if(stderr)
console.log(stderr);

View File

@ -4,12 +4,12 @@ A very simple solution to this problem is to create another chunk which contains
The configuration required for this is:
* use `[chunkhash]` in `output.filename` (Note that this example doesn't do this because of the example generator infrastructure, but you should)
* use `[chunkhash]` in `output.chunkFilename` (Note that this example doesn't do this because of the example generator infrastructure, but you should)
- use `[chunkhash]` in `output.filename` (Note that this example doesn't do this because of the example generator infrastructure, but you should)
- use `[chunkhash]` in `output.chunkFilename` (Note that this example doesn't do this because of the example generator infrastructure, but you should)
# example.js
``` javascript
```javascript
// some module
import("./async1");
import("./async2");
@ -17,7 +17,7 @@ import("./async2");
# webpack.config.js
``` javascript
```javascript
var path = require("path");
module.exports = {
// mode: "development || "production",
@ -37,20 +37,17 @@ module.exports = {
# index.html
``` html
```html
<html>
<head>
</head>
<body>
<head> </head>
<body>
<!-- inlined minimized file "runtime~main.[chunkhash].js" -->
<script>
!function(e,t){"use strict";var r={};function n(t){if(r[t])return r[t].exports;var o=r[t]={i:t,l:!1,exports:{}};return e[t].call(o.exports,o,o.exports,n),o.l=!0,o.exports}n.m=e,function(e){e.f={},e.e=function(t){return Promise.all(Object.keys(e.f).reduce(function(r,n){return e.f[n](t,r),r},[]))},e.t=function(t,r){if(1&r&&(t=this(t)),8&r)return t;if(4&r&&"object"==typeof t&&t&&t.__esModule)return t;var n=Object.create(null);if(e.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:t}),2&r&&"string"!=typeof t)for(var o in t)e.d(n,o,function(e){return t[e]}.bind(null,o));return n},t=Object.prototype.hasOwnProperty,e.d=function(e,r,n){t.call(e,r)||Object.defineProperty(e,r,{enumerable:!0,get:n})},e.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},e.p="dist/",e.u=function(e){return e+".[chunkhash].js"},function(){var t={303:0},r=[];e.f.j=function(r,n){var o=t[r];if(0!==o)if(o)n.push(o[2]);else{var u=new Promise(function(e,n){o=t[r]=[e,n]});n.push(o[2]=u);var i,a=e.p+e.u(r),c=document.createElement("script");c.charset="utf-8",c.timeout=120,e.nc&&c.setAttribute("nonce",e.nc),c.src=a,i=function(e){c.onerror=c.onload=null,clearTimeout(f);var n=function(){if(t[r])return t[r][1];0!==t[r]&&(t[r]=void 0)}();if(n){var o=e&&("load"===e.type?"missing":e.type),u=e&&e.target&&e.target.src,i=new Error("Loading chunk "+r+" failed.\n("+o+": "+u+")");i.type=o,i.request=u,n(i)}};var f=setTimeout(function(){i({type:"timeout",target:c})},12e4);c.onerror=c.onload=i,document.head.appendChild(c)}};var n=function(){};function o(){for(var n,o=0;o<r.length;o++){for(var u=r[o],i=!0,a=1;a<u.length;a++){var c=u[a];0!==t[c]&&(i=!1)}i&&(r.splice(o--,1),n=e(e.s=u[0]))}return n}function u(o){for(var u,i,a=o[0],c=o[1],l=o[2],s=o[3],p=0,d=[];p<a.length;p++)i=a[p],t[i]&&d.push(t[i][0]),t[i]=0;for(u in c)Object.prototype.hasOwnProperty.call(c,u)&&(e.m[u]=c[u]);for(s&&s(e),f&&f(o);d.length;)d.shift()();return l&&r.push.apply(r,l),n()}e.x=function(){return(n=o)()};var i=window.webpackJsonp=window.webpackJsonp||[],a=i.push.bind(i);i.push=u,i=i.slice();for(var c=0;c<i.length;c++)u(i[c]);var f=a}();var t}(n),n.x()}([]);
</script>
<!-- inlined minimized file "runtime~main.[chunkhash].js" -->
<script>
!function(e,t){"use strict";var r={};function n(t){if(r[t])return r[t].exports;var o=r[t]={i:t,l:!1,exports:{}};return e[t].call(o.exports,o,o.exports,n),o.l=!0,o.exports}n.m=e,function(e){e.f={},e.e=function(t){return Promise.all(Object.keys(e.f).reduce(function(r,n){return e.f[n](t,r),r},[]))},e.t=function(t,r){if(1&r&&(t=this(t)),8&r)return t;if(4&r&&"object"==typeof t&&t&&t.__esModule)return t;var n=Object.create(null);if(e.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:t}),2&r&&"string"!=typeof t)for(var o in t)e.d(n,o,function(e){return t[e]}.bind(null,o));return n},t=Object.prototype.hasOwnProperty,e.d=function(e,r,n){t.call(e,r)||Object.defineProperty(e,r,{enumerable:!0,get:n})},e.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},e.p="dist/",e.u=function(e){return e+".[chunkhash].js"},function(){var t={127:0},r=[];e.f.j=function(r,n){var o=t[r];if(0!==o)if(o)n.push(o[2]);else{var u=new Promise(function(e,n){o=t[r]=[e,n]});n.push(o[2]=u);var i,c=e.p+e.u(r),f=document.createElement("script");f.charset="utf-8",f.timeout=120,e.nc&&f.setAttribute("nonce",e.nc),f.src=c,i=function(e){f.onerror=f.onload=null,clearTimeout(a);var n=function(){if(t[r])return t[r][1];0!==t[r]&&(t[r]=void 0)}();if(n){var o=e&&("load"===e.type?"missing":e.type),u=e&&e.target&&e.target.src,i=new Error("Loading chunk "+r+" failed.\n("+o+": "+u+")");i.type=o,i.request=u,n(i)}};var a=setTimeout(function(){i({type:"timeout",target:f})},12e4);f.onerror=f.onload=i,document.head.appendChild(f)}};var n=function(){};function o(){for(var n,o=0;o<r.length;o++){for(var u=r[o],i=!0,c=1;c<u.length;c++){var f=u[c];0!==t[f]&&(i=!1)}i&&(r.splice(o--,1),n=e(e.s=u[0]))}return n}function u(o){for(var u,i,c=o[0],f=o[1],l=o[2],p=o[3],s=0,d=[];s<c.length;s++)i=c[s],t[i]&&d.push(t[i][0]),t[i]=0;for(u in f)Object.prototype.hasOwnProperty.call(f,u)&&(e.m[u]=f[u]);for(p&&p(e),a&&a(o);d.length;)d.shift()();return l&&r.push.apply(r,l),n()}e.x=function(){return(n=o)()};var i=window.webpackJsonp=window.webpackJsonp||[],c=i.push.bind(i);i.push=u,i=i.slice();for(var f=0;f<i.length;f++)u(i[f]);var a=c}();var t}(n),n.x()}([]);
</script>
<script src="dist/main.[chunkhash].js"></script>
</body>
<script src="dist/main.[chunkhash].js"></script>
</body>
</html>
```
@ -58,7 +55,7 @@ module.exports = {
<details><summary><code>/******/ (function(modules) { /* webpackBootstrap */ })</code></summary>
``` javascript
```javascript
/******/ (function(modules, runtime) { // webpackBootstrap
/******/ "use strict";
/******/ // The module cache
@ -104,7 +101,7 @@ module.exports = {
</details>
``` javascript
```javascript
/******/ ([],
```
@ -172,8 +169,7 @@ module.exports = {
/******/
/******/ /* webpack/runtime/get javascript chunk filename */
/******/ !function() {
/******/
/******/ // This function only allows to reference on-demand chunks
/******/ // This function allow to reference async chunks
/******/ __webpack_require__.u = function(chunkId) {
/******/ // return url for filenames based on template
/******/ return "" + chunkId + ".[chunkhash].js";
@ -330,7 +326,7 @@ module.exports = {
# dist/main.[chunkhash].js
``` javascript
```javascript
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[1],[
/* 0 */
/*!********************!*\
@ -355,14 +351,14 @@ __webpack_require__.e(/*! import() */ 3).then(__webpack_require__.t.bind(__webpa
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
2.[chunkhash].js 325 bytes {2} [emitted]
3.[chunkhash].js 319 bytes {3} [emitted]
main.[chunkhash].js 713 bytes {1} [emitted] main
runtime~main.[chunkhash].js 9.89 KiB {0} [emitted] runtime~main
runtime~main.[chunkhash].js 9.87 KiB {0} [emitted] runtime~main
Entrypoint main = runtime~main.[chunkhash].js main.[chunkhash].js
chunk {0} runtime~main.[chunkhash].js (runtime~main) 5.85 KiB [entry] [rendered]
chunk {0} runtime~main.[chunkhash].js (runtime~main) 5.84 KiB [entry] [rendered]
> ./example main
7 chunk modules
chunk {1} main.[chunkhash].js (main) 55 bytes [initial] [rendered]
@ -386,26 +382,26 @@ chunk {3} 3.[chunkhash].js 28 bytes [rendered]
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
919.[chunkhash].js 79 bytes {919} [emitted]
991.[chunkhash].js 79 bytes {991} [emitted]
main.[chunkhash].js 161 bytes {404} [emitted] main
runtime~main.[chunkhash].js 2.19 KiB {127} [emitted] runtime~main
114.[chunkhash].js 79 bytes {114} [emitted]
172.[chunkhash].js 79 bytes {172} [emitted]
main.[chunkhash].js 161 bytes {179} [emitted] main
runtime~main.[chunkhash].js 2.19 KiB {303} [emitted] runtime~main
Entrypoint main = runtime~main.[chunkhash].js main.[chunkhash].js
chunk {127} runtime~main.[chunkhash].js (runtime~main) 5.85 KiB [entry] [rendered]
chunk {114} 114.[chunkhash].js 28 bytes [rendered]
> ./async1 [144] ./example.js 2:0-18
[114] ./async1.js 28 bytes {114} [built]
import() ./async1 [144] ./example.js 2:0-18
chunk {172} 172.[chunkhash].js 28 bytes [rendered]
> ./async2 [144] ./example.js 3:0-18
[172] ./async2.js 28 bytes {172} [built]
import() ./async2 [144] ./example.js 3:0-18
chunk {179} main.[chunkhash].js (main) 55 bytes [initial] [rendered]
> ./example main
[144] ./example.js 55 bytes {179} [built]
entry ./example main
chunk {303} runtime~main.[chunkhash].js (runtime~main) 5.84 KiB [entry] [rendered]
> ./example main
7 chunk modules
chunk {404} main.[chunkhash].js (main) 55 bytes [initial] [rendered]
> ./example main
[275] ./example.js 55 bytes {404} [built]
entry ./example main
chunk {919} 919.[chunkhash].js 28 bytes [rendered]
> ./async2 [275] ./example.js 3:0-18
[919] ./async2.js 28 bytes {919} [built]
import() ./async2 [275] ./example.js 3:0-18
chunk {991} 991.[chunkhash].js 28 bytes [rendered]
> ./async1 [275] ./example.js 2:0-18
[991] ./async1.js 28 bytes {991} [built]
import() ./async1 [275] ./example.js 2:0-18
```

View File

@ -4,50 +4,47 @@ A very simple solution to this problem is to create another chunk which contains
The configuration required for this is:
* use `[chunkhash]` in `output.filename` (Note that this example doesn't do this because of the example generator infrastructure, but you should)
* use `[chunkhash]` in `output.chunkFilename` (Note that this example doesn't do this because of the example generator infrastructure, but you should)
- use `[chunkhash]` in `output.filename` (Note that this example doesn't do this because of the example generator infrastructure, but you should)
- use `[chunkhash]` in `output.chunkFilename` (Note that this example doesn't do this because of the example generator infrastructure, but you should)
# example.js
``` javascript
{{example.js}}
```javascript
_{{example.js}}_
```
# webpack.config.js
``` javascript
{{webpack.config.js}}
```javascript
_{{webpack.config.js}}_
```
# index.html
``` html
```html
<html>
<head>
</head>
<body>
<head> </head>
<body>
<!-- inlined minimized file "runtime~main.[chunkhash].js" -->
<script>
_{{production:dist/runtime~main.chunkhash.js}}_
</script>
<!-- inlined minimized file "runtime~main.[chunkhash].js" -->
<script>
{{production:dist/runtime~main.chunkhash.js}}
</script>
<script src="dist/main.[chunkhash].js"></script>
</body>
<script src="dist/main.[chunkhash].js"></script>
</body>
</html>
```
# dist/runtime~main.[chunkhash].js
``` javascript
{{dist/runtime~main.chunkhash.js}}
```javascript
_{{dist/runtime~main.chunkhash.js}}_
```
# dist/main.[chunkhash].js
``` javascript
{{dist/main.chunkhash.js}}
```javascript
_{{dist/main.chunkhash.js}}_
```
# Info
@ -55,11 +52,11 @@ The configuration required for this is:
## Unoptimized
```
{{stdout}}
_{{stdout}}_
```
## Production mode
```
{{production:stdout}}
_{{production:stdout}}_
```

View File

@ -1,140 +0,0 @@
# example.js
``` javascript
require("./style.css");
require(["./chunk"]);
```
# style.css
``` css
body {
background: url(image.png);
}
```
# chunk.js
``` javascript
require("./style2.css");
```
# style2.css
``` css
.xyz {
background: url(image2.png);
}
```
# webpack.config.js
``` javascript
var ExtractTextPlugin = require("extract-text-webpack-plugin");
module.exports = {
module: {
loaders: [
{
test: /\.css$/,
use: ExtractTextPlugin.extract({
fallback: "style-loader",
use: "css-loader"
})
},
{ test: /\.png$/, loader: "file-loader" }
]
},
plugins: [
new ExtractTextPlugin({
filename: "style.css"
})
]
};
```
# js/style.css
``` javascript
body {
background: url(js/ce21cbdd9b894e6af794813eb3fdaf60.png);
}
```
# Info
## Uncompressed
```
Hash: 5be34b0d3c624e61c616
Version: webpack 3.11.0
Asset Size Chunks Chunk Names
ce21cbdd9b894e6af794813eb3fdaf60.png 119 bytes [emitted]
0.output.js 2.44 kB 0 [emitted]
output.js 21.2 kB 1 [emitted] main
style.css 71 bytes 1 [emitted] main
Entrypoint main = output.js style.css
chunk {0} 0.output.js 1.36 kB {1} [rendered]
> [0] ./example.js 2:0-20
[5] ./chunk.js 26 bytes {0} [built]
amd require ./chunk [0] ./example.js 2:0-20
[6] ./style2.css 1.01 kB {0} [built]
cjs require ./style2.css [5] ./chunk.js 1:0-23
[7] (webpack)/node_modules/css-loader!./style2.css 236 bytes {0} [built]
cjs require !!../../node_modules/css-loader/index.js!./style2.css [6] ./style2.css 4:14-78
[8] ./image2.png 82 bytes {0} [built]
cjs require ./image2.png [7] (webpack)/node_modules/css-loader!./style2.css 6:58-81
chunk {1} output.js, style.css (main) 14.1 kB [entry] [rendered]
> main [0] ./example.js
[0] ./example.js 48 bytes {1} [built]
[1] ./style.css 41 bytes {1} [built]
cjs require ./style.css [0] ./example.js 1:0-22
+ 3 hidden modules
Child extract-text-webpack-plugin ../../node_modules/extract-text-webpack-plugin/dist ../../node_modules/css-loader/index.js!style.css:
1 asset
Entrypoint undefined = extract-text-webpack-plugin-output-filename
chunk {0} extract-text-webpack-plugin-output-filename 2.58 kB [entry] [rendered]
> [0] (webpack)/node_modules/css-loader!./style.css
[0] (webpack)/node_modules/css-loader!./style.css 235 bytes {0} [built]
[2] ./image.png 82 bytes {0} [built]
cjs require ./image.png [0] (webpack)/node_modules/css-loader!./style.css 6:58-80
+ 1 hidden module
```
## Minimized (terser, no zip)
```
Hash: edbe0e91ba86d814d855
Version: webpack 3.11.0
Asset Size Chunks Chunk Names
ce21cbdd9b894e6af794813eb3fdaf60.png 119 bytes [emitted]
0.output.js 343 bytes 0 [emitted]
output.js 6.58 kB 1 [emitted] main
style.css 61 bytes 1 [emitted] main
Entrypoint main = output.js style.css
chunk {0} 0.output.js 1.34 kB {1} [rendered]
> [0] ./example.js 2:0-20
[5] ./chunk.js 26 bytes {0} [built]
amd require ./chunk [0] ./example.js 2:0-20
[6] ./style2.css 1.01 kB {0} [built]
cjs require ./style2.css [5] ./chunk.js 1:0-23
[7] (webpack)/node_modules/css-loader!./style2.css 219 bytes {0} [built]
cjs require !!../../node_modules/css-loader/index.js!./style2.css [6] ./style2.css 4:14-78
[8] ./image2.png 82 bytes {0} [built]
cjs require ./image2.png [7] (webpack)/node_modules/css-loader!./style2.css 6:50-73
chunk {1} output.js, style.css (main) 14.1 kB [entry] [rendered]
> main [0] ./example.js
[0] ./example.js 48 bytes {1} [built]
[1] ./style.css 41 bytes {1} [built]
cjs require ./style.css [0] ./example.js 1:0-22
+ 3 hidden modules
Child extract-text-webpack-plugin ../../node_modules/extract-text-webpack-plugin/dist ../../node_modules/css-loader/index.js!style.css:
1 asset
Entrypoint undefined = extract-text-webpack-plugin-output-filename
chunk {0} extract-text-webpack-plugin-output-filename 2.56 kB [entry] [rendered]
> [0] (webpack)/node_modules/css-loader!./style.css
[0] (webpack)/node_modules/css-loader!./style.css 218 bytes {0} [built]
[2] ./image.png 82 bytes {0} [built]
cjs require ./image.png [0] (webpack)/node_modules/css-loader!./style.css 6:50-72
+ 1 hidden module
```

View File

@ -79,7 +79,7 @@ getTemplate("b", function(b) {
/***/ (function(__unusedmodule, __unusedexports, __webpack_require__) {
function getTemplate(templateName, callback) {
__webpack_require__.e(/*! AMD require */ 925).then(function() { var __WEBPACK_AMD_REQUIRE_ARRAY__ = [__webpack_require__(1)("./"+templateName)]; (function(tmpl) {
__webpack_require__.e(/*! AMD require */ 577).then(function() { var __WEBPACK_AMD_REQUIRE_ARRAY__ = [__webpack_require__(1)("./"+templateName)]; (function(tmpl) {
callback(tmpl());
}).apply(null, __WEBPACK_AMD_REQUIRE_ARRAY__);}).catch(__webpack_require__.oe);
}
@ -117,8 +117,7 @@ getTemplate("b", function(b) {
/******/
/******/ /* webpack/runtime/get javascript chunk filename */
/******/ !function() {
/******/
/******/ // This function only allows to reference on-demand chunks
/******/ // This function allow to reference async chunks
/******/ __webpack_require__.u = function(chunkId) {
/******/ // return url for filenames based on template
/******/ return "" + chunkId + ".output.js";
@ -133,7 +132,7 @@ getTemplate("b", function(b) {
/******/ // undefined = chunk not loaded, null = chunk preloaded/prefetched
/******/ // Promise = chunk loading, 0 = chunk loaded
/******/ var installedChunks = {
/******/ 404: 0
/******/ 179: 0
/******/ };
/******/
/******/
@ -246,10 +245,10 @@ getTemplate("b", function(b) {
</details>
# dist/925.output.js
# dist/577.output.js
``` javascript
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[925],[
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[577],[
/* 0 */,
/* 1 */
/*!**************************************************!*\
@ -274,13 +273,12 @@ function webpackContext(req) {
return __webpack_require__(id);
}
function webpackContextResolve(req) {
var id = map[req];
if(!(id + 1)) { // check for number or string
if(!Object.prototype.hasOwnProperty.call(map, req)) {
var e = new Error("Cannot find module '" + req + "'");
e.code = 'MODULE_NOT_FOUND';
throw e;
}
return id;
return map[req];
}
webpackContext.keys = function webpackContextKeys() {
return Object.keys(map);
@ -338,31 +336,31 @@ module.exports = function() {
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
925.output.js 2.14 KiB {925} [emitted]
output.js 7.67 KiB {404} [emitted] main
577.output.js 2.13 KiB {577} [emitted]
output.js 7.64 KiB {179} [emitted] main
Entrypoint main = output.js
chunk {404} output.js (main) 251 bytes (javascript) 3.65 KiB (runtime) [entry] [rendered]
chunk {179} output.js (main) 251 bytes (javascript) 3.64 KiB (runtime) [entry] [rendered]
> ./example.js main
[0] ./example.js 251 bytes {404} [built]
[0] ./example.js 251 bytes {179} [built]
[used exports unknown]
entry ./example.js main
+ 4 hidden chunk modules
chunk {925} 925.output.js 457 bytes [rendered]
chunk {577} 577.output.js 457 bytes [rendered]
> [0] ./example.js 2:1-4:3
[1] ../require.context/templates sync ^\.\/.*$ 217 bytes {925} [built]
[1] ../require.context/templates sync ^\.\/.*$ 217 bytes {577} [built]
[used exports unknown]
amd require context ../require.context/templates [0] ./example.js 2:1-4:3
[2] ../require.context/templates/a.js 80 bytes {925} [optional] [built]
[2] ../require.context/templates/a.js 80 bytes {577} [optional] [built]
[used exports unknown]
context element ./a [1] ../require.context/templates sync ^\.\/.*$ ./a
context element ./a.js [1] ../require.context/templates sync ^\.\/.*$ ./a.js
[3] ../require.context/templates/b.js 80 bytes {925} [optional] [built]
[3] ../require.context/templates/b.js 80 bytes {577} [optional] [built]
[used exports unknown]
context element ./b [1] ../require.context/templates sync ^\.\/.*$ ./b
context element ./b.js [1] ../require.context/templates sync ^\.\/.*$ ./b.js
[4] ../require.context/templates/c.js 80 bytes {925} [optional] [built]
[4] ../require.context/templates/c.js 80 bytes {577} [optional] [built]
[used exports unknown]
context element ./c [1] ../require.context/templates sync ^\.\/.*$ ./c
context element ./c.js [1] ../require.context/templates sync ^\.\/.*$ ./c.js
@ -372,27 +370,27 @@ chunk {925} 925.output.js 457 bytes [rendered]
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
925.output.js 651 bytes {925} [emitted]
output.js 1.51 KiB {404} [emitted] main
577.output.js 676 bytes {577} [emitted]
output.js 1.51 KiB {179} [emitted] main
Entrypoint main = output.js
chunk {404} output.js (main) 251 bytes (javascript) 3.65 KiB (runtime) [entry] [rendered]
chunk {179} output.js (main) 251 bytes (javascript) 3.64 KiB (runtime) [entry] [rendered]
> ./example.js main
[275] ./example.js 251 bytes {404} [built]
[144] ./example.js 251 bytes {179} [built]
entry ./example.js main
+ 4 hidden chunk modules
chunk {925} 925.output.js 457 bytes [rendered]
> [275] ./example.js 2:1-4:3
[145] ../require.context/templates/a.js 80 bytes {925} [optional] [built]
context element ./a [925] ../require.context/templates sync ^\.\/.*$ ./a
context element ./a.js [925] ../require.context/templates sync ^\.\/.*$ ./a.js
[221] ../require.context/templates/c.js 80 bytes {925} [optional] [built]
context element ./c [925] ../require.context/templates sync ^\.\/.*$ ./c
context element ./c.js [925] ../require.context/templates sync ^\.\/.*$ ./c.js
[641] ../require.context/templates/b.js 80 bytes {925} [optional] [built]
context element ./b [925] ../require.context/templates sync ^\.\/.*$ ./b
context element ./b.js [925] ../require.context/templates sync ^\.\/.*$ ./b.js
[925] ../require.context/templates sync ^\.\/.*$ 217 bytes {925} [built]
amd require context ../require.context/templates [275] ./example.js 2:1-4:3
chunk {577} 577.output.js 457 bytes [rendered]
> [144] ./example.js 2:1-4:3
[34] ../require.context/templates/a.js 80 bytes {577} [optional] [built]
context element ./a [577] ../require.context/templates sync ^\.\/.*$ ./a
context element ./a.js [577] ../require.context/templates sync ^\.\/.*$ ./a.js
[413] ../require.context/templates/c.js 80 bytes {577} [optional] [built]
context element ./c [577] ../require.context/templates sync ^\.\/.*$ ./c
context element ./c.js [577] ../require.context/templates sync ^\.\/.*$ ./c.js
[577] ../require.context/templates sync ^\.\/.*$ 217 bytes {577} [built]
amd require context ../require.context/templates [144] ./example.js 2:1-4:3
[631] ../require.context/templates/b.js 80 bytes {577} [optional] [built]
context element ./b [577] ../require.context/templates sync ^\.\/.*$ ./b
context element ./b.js [577] ../require.context/templates sync ^\.\/.*$ ./b.js
```

View File

@ -1,19 +1,19 @@
# example.js
``` javascript
{{example.js}}
_{{example.js}}_
```
# dist/output.js
``` javascript
{{dist/output.js}}
_{{dist/output.js}}_
```
# dist/925.output.js
# dist/577.output.js
``` javascript
{{dist/925.output.js}}
_{{dist/577.output.js}}_
```
# Info
@ -21,11 +21,11 @@
## Unoptimized
```
{{stdout}}
_{{stdout}}_
```
## Production mode
```
{{production:stdout}}
_{{production:stdout}}_
```

View File

@ -79,7 +79,7 @@ getTemplate("b", function(b) {
/***/ (function(__unusedmodule, __unusedexports, __webpack_require__) {
function getTemplate(templateName, callback) {
__webpack_require__.e(/*! require.ensure */ 925).then((function(require) {
__webpack_require__.e(/*! require.ensure */ 577).then((function(require) {
callback(__webpack_require__(1)("./"+templateName)());
}).bind(null, __webpack_require__)).catch(__webpack_require__.oe);
}
@ -117,8 +117,7 @@ getTemplate("b", function(b) {
/******/
/******/ /* webpack/runtime/get javascript chunk filename */
/******/ !function() {
/******/
/******/ // This function only allows to reference on-demand chunks
/******/ // This function allow to reference async chunks
/******/ __webpack_require__.u = function(chunkId) {
/******/ // return url for filenames based on template
/******/ return "" + chunkId + ".output.js";
@ -133,7 +132,7 @@ getTemplate("b", function(b) {
/******/ // undefined = chunk not loaded, null = chunk preloaded/prefetched
/******/ // Promise = chunk loading, 0 = chunk loaded
/******/ var installedChunks = {
/******/ 404: 0
/******/ 179: 0
/******/ };
/******/
/******/
@ -246,10 +245,10 @@ getTemplate("b", function(b) {
</details>
# dist/925.output.js
# dist/577.output.js
``` javascript
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[925],[
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[577],[
/* 0 */,
/* 1 */
/*!**************************************************!*\
@ -274,13 +273,12 @@ function webpackContext(req) {
return __webpack_require__(id);
}
function webpackContextResolve(req) {
var id = map[req];
if(!(id + 1)) { // check for number or string
if(!Object.prototype.hasOwnProperty.call(map, req)) {
var e = new Error("Cannot find module '" + req + "'");
e.code = 'MODULE_NOT_FOUND';
throw e;
}
return id;
return map[req];
}
webpackContext.keys = function webpackContextKeys() {
return Object.keys(map);
@ -338,31 +336,31 @@ module.exports = function() {
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
925.output.js 2.14 KiB {925} [emitted]
output.js 7.58 KiB {404} [emitted] main
577.output.js 2.13 KiB {577} [emitted]
output.js 7.56 KiB {179} [emitted] main
Entrypoint main = output.js
chunk {404} output.js (main) 266 bytes (javascript) 3.65 KiB (runtime) [entry] [rendered]
chunk {179} output.js (main) 266 bytes (javascript) 3.64 KiB (runtime) [entry] [rendered]
> ./example.js main
[0] ./example.js 266 bytes {404} [built]
[0] ./example.js 266 bytes {179} [built]
[used exports unknown]
entry ./example.js main
+ 4 hidden chunk modules
chunk {925} 925.output.js 457 bytes [rendered]
chunk {577} 577.output.js 457 bytes [rendered]
> [0] ./example.js 2:1-4:3
[1] ../require.context/templates sync ^\.\/.*$ 217 bytes {925} [built]
[1] ../require.context/templates sync ^\.\/.*$ 217 bytes {577} [built]
[used exports unknown]
cjs require context ../require.context/templates [0] ./example.js 3:11-64
[2] ../require.context/templates/a.js 80 bytes {925} [optional] [built]
[2] ../require.context/templates/a.js 80 bytes {577} [optional] [built]
[used exports unknown]
context element ./a [1] ../require.context/templates sync ^\.\/.*$ ./a
context element ./a.js [1] ../require.context/templates sync ^\.\/.*$ ./a.js
[3] ../require.context/templates/b.js 80 bytes {925} [optional] [built]
[3] ../require.context/templates/b.js 80 bytes {577} [optional] [built]
[used exports unknown]
context element ./b [1] ../require.context/templates sync ^\.\/.*$ ./b
context element ./b.js [1] ../require.context/templates sync ^\.\/.*$ ./b.js
[4] ../require.context/templates/c.js 80 bytes {925} [optional] [built]
[4] ../require.context/templates/c.js 80 bytes {577} [optional] [built]
[used exports unknown]
context element ./c [1] ../require.context/templates sync ^\.\/.*$ ./c
context element ./c.js [1] ../require.context/templates sync ^\.\/.*$ ./c.js
@ -372,27 +370,27 @@ chunk {925} 925.output.js 457 bytes [rendered]
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
925.output.js 651 bytes {925} [emitted]
output.js 1.49 KiB {404} [emitted] main
577.output.js 676 bytes {577} [emitted]
output.js 1.49 KiB {179} [emitted] main
Entrypoint main = output.js
chunk {404} output.js (main) 266 bytes (javascript) 3.65 KiB (runtime) [entry] [rendered]
chunk {179} output.js (main) 266 bytes (javascript) 3.64 KiB (runtime) [entry] [rendered]
> ./example.js main
[275] ./example.js 266 bytes {404} [built]
[144] ./example.js 266 bytes {179} [built]
entry ./example.js main
+ 4 hidden chunk modules
chunk {925} 925.output.js 457 bytes [rendered]
> [275] ./example.js 2:1-4:3
[145] ../require.context/templates/a.js 80 bytes {925} [optional] [built]
context element ./a [925] ../require.context/templates sync ^\.\/.*$ ./a
context element ./a.js [925] ../require.context/templates sync ^\.\/.*$ ./a.js
[221] ../require.context/templates/c.js 80 bytes {925} [optional] [built]
context element ./c [925] ../require.context/templates sync ^\.\/.*$ ./c
context element ./c.js [925] ../require.context/templates sync ^\.\/.*$ ./c.js
[641] ../require.context/templates/b.js 80 bytes {925} [optional] [built]
context element ./b [925] ../require.context/templates sync ^\.\/.*$ ./b
context element ./b.js [925] ../require.context/templates sync ^\.\/.*$ ./b.js
[925] ../require.context/templates sync ^\.\/.*$ 217 bytes {925} [built]
cjs require context ../require.context/templates [275] ./example.js 3:11-64
chunk {577} 577.output.js 457 bytes [rendered]
> [144] ./example.js 2:1-4:3
[34] ../require.context/templates/a.js 80 bytes {577} [optional] [built]
context element ./a [577] ../require.context/templates sync ^\.\/.*$ ./a
context element ./a.js [577] ../require.context/templates sync ^\.\/.*$ ./a.js
[413] ../require.context/templates/c.js 80 bytes {577} [optional] [built]
context element ./c [577] ../require.context/templates sync ^\.\/.*$ ./c
context element ./c.js [577] ../require.context/templates sync ^\.\/.*$ ./c.js
[577] ../require.context/templates sync ^\.\/.*$ 217 bytes {577} [built]
cjs require context ../require.context/templates [144] ./example.js 3:11-64
[631] ../require.context/templates/b.js 80 bytes {577} [optional] [built]
context element ./b [577] ../require.context/templates sync ^\.\/.*$ ./b
context element ./b.js [577] ../require.context/templates sync ^\.\/.*$ ./b.js
```

View File

@ -1,19 +1,19 @@
# example.js
``` javascript
{{example.js}}
_{{example.js}}_
```
# dist/output.js
``` javascript
{{dist/output.js}}
_{{dist/output.js}}_
```
# dist/925.output.js
# dist/577.output.js
``` javascript
{{dist/925.output.js}}
_{{dist/577.output.js}}_
```
# Info
@ -21,11 +21,11 @@
## Unoptimized
```
{{stdout}}
_{{stdout}}_
```
## Production mode
```
{{production:stdout}}
_{{production:stdout}}_
```

View File

@ -4,7 +4,7 @@ The bundle loader is used to create a wrapper module for `file.js` that loads th
# example.js
``` javascript
```javascript
require("bundle-loader!./file.js")(function(fileJsExports) {
console.log(fileJsExports);
});
@ -12,16 +12,15 @@ require("bundle-loader!./file.js")(function(fileJsExports) {
# file.js
``` javascript
```javascript
module.exports = "It works";
```
# dist/output.js
<details><summary><code>/******/ (function(modules) { /* webpackBootstrap */ })</code></summary>
``` javascript
```javascript
/******/ (function(modules, runtime) { // webpackBootstrap
/******/ "use strict";
/******/ // The module cache
@ -71,7 +70,7 @@ module.exports = "It works";
</details>
``` javascript
```javascript
/******/ ([
/* 0 */
/*!********************!*\
@ -101,7 +100,7 @@ module.exports = function(cb) {
if(cbs) cbs.push(cb);
else cb(data);
}
__webpack_require__.e(/*! require.ensure */ 396).then((function(require) {
__webpack_require__.e(/*! require.ensure */ 929).then((function(require) {
data = __webpack_require__(/*! !./file.js */ 2);
var callbacks = cbs;
cbs = null;
@ -137,8 +136,7 @@ __webpack_require__.e(/*! require.ensure */ 396).then((function(require) {
/******/
/******/ /* webpack/runtime/get javascript chunk filename */
/******/ !function() {
/******/
/******/ // This function only allows to reference on-demand chunks
/******/ // This function allow to reference async chunks
/******/ __webpack_require__.u = function(chunkId) {
/******/ // return url for filenames based on template
/******/ return "" + chunkId + ".output.js";
@ -153,7 +151,7 @@ __webpack_require__.e(/*! require.ensure */ 396).then((function(require) {
/******/ // undefined = chunk not loaded, null = chunk preloaded/prefetched
/******/ // Promise = chunk loading, 0 = chunk loaded
/******/ var installedChunks = {
/******/ 404: 0
/******/ 179: 0
/******/ };
/******/
/******/
@ -266,10 +264,10 @@ __webpack_require__.e(/*! require.ensure */ 396).then((function(require) {
</details>
# dist/396.output.js
# dist/929.output.js
``` javascript
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[396],{
```javascript
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[929],{
/***/ 2:
/*!*****************!*\
@ -292,45 +290,45 @@ module.exports = "It works";
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
396.output.js 327 bytes {396} [emitted]
output.js 8.12 KiB {404} [emitted] main
929.output.js 327 bytes {929} [emitted]
output.js 8.1 KiB {179} [emitted] main
Entrypoint main = output.js
chunk {396} 396.output.js 28 bytes [rendered]
> [1] (webpack)/node_modules/bundle-loader!./file.js 7:0-14:2
[2] ./file.js 28 bytes {396} [built]
[used exports unknown]
cjs require !!./file.js [1] (webpack)/node_modules/bundle-loader!./file.js 8:8-30
chunk {404} output.js (main) 375 bytes (javascript) 3.65 KiB (runtime) [entry] [rendered]
chunk {179} output.js (main) 375 bytes (javascript) 3.64 KiB (runtime) [entry] [rendered]
> ./example.js main
[0] ./example.js 94 bytes {404} [built]
[0] ./example.js 94 bytes {179} [built]
[used exports unknown]
entry ./example.js main
[1] (webpack)/node_modules/bundle-loader!./file.js 281 bytes {404} [built]
[1] (webpack)/node_modules/bundle-loader!./file.js 281 bytes {179} [built]
[used exports unknown]
cjs require bundle-loader!./file.js [0] ./example.js 1:0-34
+ 4 hidden chunk modules
chunk {929} 929.output.js 28 bytes [rendered]
> [1] (webpack)/node_modules/bundle-loader!./file.js 7:0-14:2
[2] ./file.js 28 bytes {929} [built]
[used exports unknown]
cjs require !!./file.js [1] (webpack)/node_modules/bundle-loader!./file.js 8:8-30
```
## Production mode
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
396.output.js 100 bytes {396} [emitted]
output.js 1.55 KiB {404} [emitted] main
929.output.js 100 bytes {929} [emitted]
output.js 1.55 KiB {179} [emitted] main
Entrypoint main = output.js
chunk {396} 396.output.js 28 bytes [rendered]
> [83] (webpack)/node_modules/bundle-loader!./file.js 7:0-14:2
[396] ./file.js 28 bytes {396} [built]
cjs require !!./file.js [83] (webpack)/node_modules/bundle-loader!./file.js 8:8-30
chunk {404} output.js (main) 375 bytes (javascript) 3.65 KiB (runtime) [entry] [rendered]
chunk {179} output.js (main) 375 bytes (javascript) 3.64 KiB (runtime) [entry] [rendered]
> ./example.js main
[83] (webpack)/node_modules/bundle-loader!./file.js 281 bytes {404} [built]
cjs require bundle-loader!./file.js [275] ./example.js 1:0-34
[275] ./example.js 94 bytes {404} [built]
[144] ./example.js 94 bytes {179} [built]
entry ./example.js main
[341] (webpack)/node_modules/bundle-loader!./file.js 281 bytes {179} [built]
cjs require bundle-loader!./file.js [144] ./example.js 1:0-34
+ 4 hidden chunk modules
chunk {929} 929.output.js 28 bytes [rendered]
> [341] (webpack)/node_modules/bundle-loader!./file.js 7:0-14:2
[929] ./file.js 28 bytes {929} [built]
cjs require !!./file.js [341] (webpack)/node_modules/bundle-loader!./file.js 8:8-30
```

View File

@ -4,27 +4,26 @@ The bundle loader is used to create a wrapper module for `file.js` that loads th
# example.js
``` javascript
{{example.js}}
```javascript
_{{example.js}}_
```
# file.js
``` javascript
{{file.js}}
```javascript
_{{file.js}}_
```
# dist/output.js
``` javascript
{{dist/output.js}}
```javascript
_{{dist/output.js}}_
```
# dist/396.output.js
# dist/929.output.js
``` javascript
{{dist/396.output.js}}
```javascript
_{{dist/929.output.js}}_
```
# Info
@ -32,11 +31,11 @@ The bundle loader is used to create a wrapper module for `file.js` that loads th
## Unoptimized
```
{{stdout}}
_{{stdout}}_
```
## Production mode
```
{{production:stdout}}
_{{production:stdout}}_
```

View File

@ -8,7 +8,7 @@ Providing dynamic expressions to `import` is possible. The same limits as with d
# example.js
``` javascript
```javascript
import a from "a";
import("b").then(function(b) {
@ -24,12 +24,11 @@ Promise.all([loadC("1"), loadC("2")]).then(function(arr) {
});
```
# dist/output.js
<details><summary><code>/******/ (function(modules) { /* webpackBootstrap */ })</code></summary>
``` javascript
```javascript
/******/ (function(modules, runtime) { // webpackBootstrap
/******/ "use strict";
/******/ // The module cache
@ -79,7 +78,7 @@ Promise.all([loadC("1"), loadC("2")]).then(function(arr) {
</details>
``` javascript
```javascript
/******/ ([
/* 0 */
/*!********************!*\
@ -95,7 +94,7 @@ __webpack_require__.r(__webpack_exports__);
/* harmony import */ var a__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(a__WEBPACK_IMPORTED_MODULE_0__);
__webpack_require__.e(/*! import() */ 215).then(__webpack_require__.t.bind(__webpack_require__, /*! b */ 3, 7)).then(function(b) {
__webpack_require__.e(/*! import() */ 644).then(__webpack_require__.t.bind(__webpack_require__, /*! b */ 3, 7)).then(function(b) {
console.log("b loaded", b);
})
@ -131,32 +130,32 @@ Promise.all([loadC("1"), loadC("2")]).then(function(arr) {
var map = {
"./1": [
4,
742
346
],
"./1.js": [
4,
742
346
],
"./2": [
5,
666
98
],
"./2.js": [
5,
666
98
]
};
function webpackAsyncContext(req) {
var ids = map[req];
if(!ids) {
if(!Object.prototype.hasOwnProperty.call(map, req)) {
return Promise.resolve().then(function() {
var e = new Error("Cannot find module '" + req + "'");
e.code = 'MODULE_NOT_FOUND';
throw e;
});
}
var ids = map[req], id = ids[0];
return __webpack_require__.e(ids[1]).then(function() {
var id = ids[0];
return __webpack_require__.t(id, 7);
});
}
@ -246,8 +245,7 @@ module.exports = webpackAsyncContext;
/******/
/******/ /* webpack/runtime/get javascript chunk filename */
/******/ !function() {
/******/
/******/ // This function only allows to reference on-demand chunks
/******/ // This function allow to reference async chunks
/******/ __webpack_require__.u = function(chunkId) {
/******/ // return url for filenames based on template
/******/ return "" + chunkId + ".output.js";
@ -262,7 +260,7 @@ module.exports = webpackAsyncContext;
/******/ // undefined = chunk not loaded, null = chunk preloaded/prefetched
/******/ // Promise = chunk loading, 0 = chunk loaded
/******/ var installedChunks = {
/******/ 404: 0
/******/ 179: 0
/******/ };
/******/
/******/
@ -375,90 +373,89 @@ module.exports = webpackAsyncContext;
</details>
# Info
## Unoptimized
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
215.output.js 328 bytes {215} [emitted]
666.output.js 336 bytes {666} [emitted]
742.output.js 336 bytes {742} [emitted]
output.js 11.7 KiB {404} [emitted] main
346.output.js 336 bytes {346} [emitted]
644.output.js 328 bytes {644} [emitted]
98.output.js 335 bytes {98} [emitted]
output.js 11.7 KiB {179} [emitted] main
Entrypoint main = output.js
chunk {215} 215.output.js 11 bytes [rendered]
> b [0] ./example.js 3:0-11
[3] ./node_modules/b.js 11 bytes {215} [built]
[used exports unknown]
import() b [0] ./example.js 3:0-11
chunk {404} output.js (main) 414 bytes (javascript) 5.22 KiB (runtime) [entry] [rendered]
> ./example.js main
[0] ./example.js 243 bytes {404} [built]
[no exports]
[used exports unknown]
entry ./example.js main
[1] ./node_modules/a.js 11 bytes {404} [built]
[used exports unknown]
harmony side effect evaluation a [0] ./example.js 1:0-18
[2] ./node_modules/c lazy ^\.\/.*$ namespace object 160 bytes {404} [built]
[used exports unknown]
import() context lazy c [0] ./example.js 8:8-27
+ 8 hidden chunk modules
chunk {666} 666.output.js 13 bytes [rendered]
chunk {98} 98.output.js 13 bytes [rendered]
> ./2 [2] ./node_modules/c lazy ^\.\/.*$ namespace object ./2
> ./2.js [2] ./node_modules/c lazy ^\.\/.*$ namespace object ./2.js
[5] ./node_modules/c/2.js 13 bytes {666} [optional] [built]
[5] ./node_modules/c/2.js 13 bytes {98} [optional] [built]
[used exports unknown]
context element ./2 [2] ./node_modules/c lazy ^\.\/.*$ namespace object ./2
context element ./2.js [2] ./node_modules/c lazy ^\.\/.*$ namespace object ./2.js
chunk {742} 742.output.js 13 bytes [rendered]
chunk {179} output.js (main) 414 bytes (javascript) 5.21 KiB (runtime) [entry] [rendered]
> ./example.js main
[0] ./example.js 243 bytes {179} [built]
[no exports]
[used exports unknown]
entry ./example.js main
[1] ./node_modules/a.js 11 bytes {179} [built]
[used exports unknown]
harmony side effect evaluation a [0] ./example.js 1:0-18
[2] ./node_modules/c lazy ^\.\/.*$ namespace object 160 bytes {179} [built]
[used exports unknown]
import() context lazy c [0] ./example.js 8:8-27
+ 8 hidden chunk modules
chunk {346} 346.output.js 13 bytes [rendered]
> ./1 [2] ./node_modules/c lazy ^\.\/.*$ namespace object ./1
> ./1.js [2] ./node_modules/c lazy ^\.\/.*$ namespace object ./1.js
[4] ./node_modules/c/1.js 13 bytes {742} [optional] [built]
[4] ./node_modules/c/1.js 13 bytes {346} [optional] [built]
[used exports unknown]
context element ./1 [2] ./node_modules/c lazy ^\.\/.*$ namespace object ./1
context element ./1.js [2] ./node_modules/c lazy ^\.\/.*$ namespace object ./1.js
chunk {644} 644.output.js 11 bytes [rendered]
> b [0] ./example.js 3:0-11
[3] ./node_modules/b.js 11 bytes {644} [built]
[used exports unknown]
import() b [0] ./example.js 3:0-11
```
## Production mode
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
215.output.js 79 bytes {215} [emitted]
666.output.js 79 bytes {666} [emitted]
742.output.js 79 bytes {742} [emitted]
output.js 2.61 KiB {404} [emitted] main
346.output.js 79 bytes {346} [emitted]
644.output.js 79 bytes {644} [emitted]
98.output.js 77 bytes {98} [emitted]
output.js 2.66 KiB {179} [emitted] main
Entrypoint main = output.js
chunk {215} 215.output.js 11 bytes [rendered]
> b [275] ./example.js 3:0-11
[215] ./node_modules/b.js 11 bytes {215} [built]
import() b [275] ./example.js 3:0-11
chunk {404} output.js (main) 414 bytes (javascript) 5.22 KiB (runtime) [entry] [rendered]
chunk {98} 98.output.js 13 bytes [rendered]
> ./2 [616] ./node_modules/c lazy ^\.\/.*$ namespace object ./2
> ./2.js [616] ./node_modules/c lazy ^\.\/.*$ namespace object ./2.js
[98] ./node_modules/c/2.js 13 bytes {98} [optional] [built]
context element ./2 [616] ./node_modules/c lazy ^\.\/.*$ namespace object ./2
context element ./2.js [616] ./node_modules/c lazy ^\.\/.*$ namespace object ./2.js
chunk {179} output.js (main) 414 bytes (javascript) 5.21 KiB (runtime) [entry] [rendered]
> ./example.js main
[54] ./node_modules/a.js 11 bytes {404} [built]
[no exports used]
harmony side effect evaluation a [275] ./example.js 1:0-18
[212] ./node_modules/c lazy ^\.\/.*$ namespace object 160 bytes {404} [built]
import() context lazy c [275] ./example.js 8:8-27
[275] ./example.js 243 bytes {404} [built]
[144] ./example.js 243 bytes {179} [built]
[no exports]
entry ./example.js main
[213] ./node_modules/a.js 11 bytes {179} [built]
[no exports used]
harmony side effect evaluation a [144] ./example.js 1:0-18
[616] ./node_modules/c lazy ^\.\/.*$ namespace object 160 bytes {179} [built]
import() context lazy c [144] ./example.js 8:8-27
+ 8 hidden chunk modules
chunk {666} 666.output.js 13 bytes [rendered]
> ./2 [212] ./node_modules/c lazy ^\.\/.*$ namespace object ./2
> ./2.js [212] ./node_modules/c lazy ^\.\/.*$ namespace object ./2.js
[666] ./node_modules/c/2.js 13 bytes {666} [optional] [built]
context element ./2 [212] ./node_modules/c lazy ^\.\/.*$ namespace object ./2
context element ./2.js [212] ./node_modules/c lazy ^\.\/.*$ namespace object ./2.js
chunk {742} 742.output.js 13 bytes [rendered]
> ./1 [212] ./node_modules/c lazy ^\.\/.*$ namespace object ./1
> ./1.js [212] ./node_modules/c lazy ^\.\/.*$ namespace object ./1.js
[742] ./node_modules/c/1.js 13 bytes {742} [optional] [built]
context element ./1 [212] ./node_modules/c lazy ^\.\/.*$ namespace object ./1
context element ./1.js [212] ./node_modules/c lazy ^\.\/.*$ namespace object ./1.js
chunk {346} 346.output.js 13 bytes [rendered]
> ./1 [616] ./node_modules/c lazy ^\.\/.*$ namespace object ./1
> ./1.js [616] ./node_modules/c lazy ^\.\/.*$ namespace object ./1.js
[346] ./node_modules/c/1.js 13 bytes {346} [optional] [built]
context element ./1 [616] ./node_modules/c lazy ^\.\/.*$ namespace object ./1
context element ./1.js [616] ./node_modules/c lazy ^\.\/.*$ namespace object ./1.js
chunk {644} 644.output.js 11 bytes [rendered]
> b [144] ./example.js 3:0-11
[644] ./node_modules/b.js 11 bytes {644} [built]
import() b [144] ./example.js 3:0-11
```

View File

@ -8,28 +8,26 @@ Providing dynamic expressions to `import` is possible. The same limits as with d
# example.js
``` javascript
{{example.js}}
```javascript
_{{example.js}}_
```
# dist/output.js
``` javascript
{{dist/output.js}}
```javascript
_{{dist/output.js}}_
```
# Info
## Unoptimized
```
{{stdout}}
_{{stdout}}_
```
## Production mode
```
{{production:stdout}}
_{{production:stdout}}_
```

View File

@ -1,9 +1,9 @@
# example.js
This example illustrates how to filter the ContextModule results of `import()` statements. only `.js` files that don't
This example illustrates how to filter the ContextModule results of `import()` statements. only `.js` files that don't
end in `.noimport.js` within the `templates` folder will be bundled.
``` javascript
```javascript
async function getTemplate(templateName) {
try {
let template = await import(
@ -28,16 +28,16 @@ getTemplate("baz.noimport");
# templates/
* foo.js
* foo.noimport.js
* baz.js
* foo.noimport.js
* bar.js
* foo.noimport.js
- foo.js
- foo.noimport.js
- baz.js
- foo.noimport.js
- bar.js
- foo.noimport.js
All templates are of this pattern:
``` javascript
```javascript
var foo = "foo";
export default foo;
@ -47,7 +47,7 @@ export default foo;
<details><summary><code>/******/ (function(modules) { /* webpackBootstrap */ })</code></summary>
``` javascript
```javascript
/******/ (function(modules, runtime) { // webpackBootstrap
/******/ "use strict";
/******/ // The module cache
@ -97,7 +97,7 @@ export default foo;
</details>
``` javascript
```javascript
/******/ ([
/* 0 */
/*!********************!*\
@ -138,40 +138,40 @@ getTemplate("baz.noimport");
var map = {
"./bar": [
2,
920
398
],
"./bar.js": [
2,
920
398
],
"./baz": [
3,
374
544
],
"./baz.js": [
3,
374
544
],
"./foo": [
4,
457
718
],
"./foo.js": [
4,
457
718
]
};
function webpackAsyncContext(req) {
var ids = map[req];
if(!ids) {
if(!Object.prototype.hasOwnProperty.call(map, req)) {
return Promise.resolve().then(function() {
var e = new Error("Cannot find module '" + req + "'");
e.code = 'MODULE_NOT_FOUND';
throw e;
});
}
var ids = map[req], id = ids[0];
return __webpack_require__.e(ids[1]).then(function() {
var id = ids[0];
return __webpack_require__(id);
});
}
@ -219,8 +219,7 @@ module.exports = webpackAsyncContext;
/******/
/******/ /* webpack/runtime/get javascript chunk filename */
/******/ !function() {
/******/
/******/ // This function only allows to reference on-demand chunks
/******/ // This function allow to reference async chunks
/******/ __webpack_require__.u = function(chunkId) {
/******/ // return url for filenames based on template
/******/ return "" + chunkId + ".output.js";
@ -235,7 +234,7 @@ module.exports = webpackAsyncContext;
/******/ // undefined = chunk not loaded, null = chunk preloaded/prefetched
/******/ // Promise = chunk loading, 0 = chunk loaded
/******/ var installedChunks = {
/******/ 404: 0
/******/ 179: 0
/******/ };
/******/
/******/
@ -354,85 +353,85 @@ module.exports = webpackAsyncContext;
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
374.output.js 646 bytes {374} [emitted]
457.output.js 646 bytes {457} [emitted]
920.output.js 646 bytes {920} [emitted]
output.js 9.19 KiB {404} [emitted] main
398.output.js 646 bytes {398} [emitted]
544.output.js 646 bytes {544} [emitted]
718.output.js 646 bytes {718} [emitted]
output.js 9.21 KiB {179} [emitted] main
Entrypoint main = output.js
chunk {374} 374.output.js 38 bytes [rendered]
> ./baz [1] ./templates lazy ^\.\/.*$ include: \.js$ exclude: \.noimport\.js$ namespace object ./baz
> ./baz.js [1] ./templates lazy ^\.\/.*$ include: \.js$ exclude: \.noimport\.js$ namespace object ./baz.js
[3] ./templates/baz.js 38 bytes {374} [optional] [built]
[exports: default]
[used exports unknown]
context element ./baz [1] ./templates lazy ^\.\/.*$ include: \.js$ exclude: \.noimport\.js$ namespace object ./baz
context element ./baz.js [1] ./templates lazy ^\.\/.*$ include: \.js$ exclude: \.noimport\.js$ namespace object ./baz.js
chunk {404} output.js (main) 597 bytes (javascript) 3.93 KiB (runtime) [entry] [rendered]
chunk {179} output.js (main) 597 bytes (javascript) 3.92 KiB (runtime) [entry] [rendered]
> ./example.js main
[0] ./example.js 437 bytes {404} [built]
[0] ./example.js 437 bytes {179} [built]
[used exports unknown]
entry ./example.js main
[1] ./templates lazy ^\.\/.*$ include: \.js$ exclude: \.noimport\.js$ namespace object 160 bytes {404} [optional] [built]
[1] ./templates lazy ^\.\/.*$ include: \.js$ exclude: \.noimport\.js$ namespace object 160 bytes {179} [optional] [built]
[used exports unknown]
import() context lazy ./templates [0] ./example.js 3:23-7:3
+ 5 hidden chunk modules
chunk {457} 457.output.js 38 bytes [rendered]
> ./foo [1] ./templates lazy ^\.\/.*$ include: \.js$ exclude: \.noimport\.js$ namespace object ./foo
> ./foo.js [1] ./templates lazy ^\.\/.*$ include: \.js$ exclude: \.noimport\.js$ namespace object ./foo.js
[4] ./templates/foo.js 38 bytes {457} [optional] [built]
[exports: default]
[used exports unknown]
context element ./foo [1] ./templates lazy ^\.\/.*$ include: \.js$ exclude: \.noimport\.js$ namespace object ./foo
context element ./foo.js [1] ./templates lazy ^\.\/.*$ include: \.js$ exclude: \.noimport\.js$ namespace object ./foo.js
chunk {920} 920.output.js 38 bytes [rendered]
chunk {398} 398.output.js 38 bytes [rendered]
> ./bar [1] ./templates lazy ^\.\/.*$ include: \.js$ exclude: \.noimport\.js$ namespace object ./bar
> ./bar.js [1] ./templates lazy ^\.\/.*$ include: \.js$ exclude: \.noimport\.js$ namespace object ./bar.js
[2] ./templates/bar.js 38 bytes {920} [optional] [built]
[2] ./templates/bar.js 38 bytes {398} [optional] [built]
[exports: default]
[used exports unknown]
context element ./bar [1] ./templates lazy ^\.\/.*$ include: \.js$ exclude: \.noimport\.js$ namespace object ./bar
context element ./bar.js [1] ./templates lazy ^\.\/.*$ include: \.js$ exclude: \.noimport\.js$ namespace object ./bar.js
chunk {544} 544.output.js 38 bytes [rendered]
> ./baz [1] ./templates lazy ^\.\/.*$ include: \.js$ exclude: \.noimport\.js$ namespace object ./baz
> ./baz.js [1] ./templates lazy ^\.\/.*$ include: \.js$ exclude: \.noimport\.js$ namespace object ./baz.js
[3] ./templates/baz.js 38 bytes {544} [optional] [built]
[exports: default]
[used exports unknown]
context element ./baz [1] ./templates lazy ^\.\/.*$ include: \.js$ exclude: \.noimport\.js$ namespace object ./baz
context element ./baz.js [1] ./templates lazy ^\.\/.*$ include: \.js$ exclude: \.noimport\.js$ namespace object ./baz.js
chunk {718} 718.output.js 38 bytes [rendered]
> ./foo [1] ./templates lazy ^\.\/.*$ include: \.js$ exclude: \.noimport\.js$ namespace object ./foo
> ./foo.js [1] ./templates lazy ^\.\/.*$ include: \.js$ exclude: \.noimport\.js$ namespace object ./foo.js
[4] ./templates/foo.js 38 bytes {718} [optional] [built]
[exports: default]
[used exports unknown]
context element ./foo [1] ./templates lazy ^\.\/.*$ include: \.js$ exclude: \.noimport\.js$ namespace object ./foo
context element ./foo.js [1] ./templates lazy ^\.\/.*$ include: \.js$ exclude: \.noimport\.js$ namespace object ./foo.js
```
## Production mode
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
374.output.js 119 bytes {374} [emitted]
457.output.js 119 bytes {457} [emitted]
920.output.js 119 bytes {920} [emitted]
output.js 2.1 KiB {404} [emitted] main
398.output.js 119 bytes {398} [emitted]
544.output.js 119 bytes {544} [emitted]
718.output.js 119 bytes {718} [emitted]
output.js 2.14 KiB {179} [emitted] main
Entrypoint main = output.js
chunk {374} 374.output.js 38 bytes [rendered]
> ./baz [259] ./templates lazy ^\.\/.*$ include: \.js$ exclude: \.noimport\.js$ namespace object ./baz
> ./baz.js [259] ./templates lazy ^\.\/.*$ include: \.js$ exclude: \.noimport\.js$ namespace object ./baz.js
[374] ./templates/baz.js 38 bytes {374} [optional] [built]
[exports: default]
context element ./baz [259] ./templates lazy ^\.\/.*$ include: \.js$ exclude: \.noimport\.js$ namespace object ./baz
context element ./baz.js [259] ./templates lazy ^\.\/.*$ include: \.js$ exclude: \.noimport\.js$ namespace object ./baz.js
chunk {404} output.js (main) 597 bytes (javascript) 3.93 KiB (runtime) [entry] [rendered]
chunk {179} output.js (main) 597 bytes (javascript) 3.92 KiB (runtime) [entry] [rendered]
> ./example.js main
[259] ./templates lazy ^\.\/.*$ include: \.js$ exclude: \.noimport\.js$ namespace object 160 bytes {404} [optional] [built]
import() context lazy ./templates [275] ./example.js 3:23-7:3
[275] ./example.js 437 bytes {404} [built]
[144] ./example.js 437 bytes {179} [built]
entry ./example.js main
[389] ./templates lazy ^\.\/.*$ include: \.js$ exclude: \.noimport\.js$ namespace object 160 bytes {179} [optional] [built]
import() context lazy ./templates [144] ./example.js 3:23-7:3
+ 5 hidden chunk modules
chunk {457} 457.output.js 38 bytes [rendered]
> ./foo [259] ./templates lazy ^\.\/.*$ include: \.js$ exclude: \.noimport\.js$ namespace object ./foo
> ./foo.js [259] ./templates lazy ^\.\/.*$ include: \.js$ exclude: \.noimport\.js$ namespace object ./foo.js
[457] ./templates/foo.js 38 bytes {457} [optional] [built]
chunk {398} 398.output.js 38 bytes [rendered]
> ./bar [389] ./templates lazy ^\.\/.*$ include: \.js$ exclude: \.noimport\.js$ namespace object ./bar
> ./bar.js [389] ./templates lazy ^\.\/.*$ include: \.js$ exclude: \.noimport\.js$ namespace object ./bar.js
[398] ./templates/bar.js 38 bytes {398} [optional] [built]
[exports: default]
context element ./foo [259] ./templates lazy ^\.\/.*$ include: \.js$ exclude: \.noimport\.js$ namespace object ./foo
context element ./foo.js [259] ./templates lazy ^\.\/.*$ include: \.js$ exclude: \.noimport\.js$ namespace object ./foo.js
chunk {920} 920.output.js 38 bytes [rendered]
> ./bar [259] ./templates lazy ^\.\/.*$ include: \.js$ exclude: \.noimport\.js$ namespace object ./bar
> ./bar.js [259] ./templates lazy ^\.\/.*$ include: \.js$ exclude: \.noimport\.js$ namespace object ./bar.js
[920] ./templates/bar.js 38 bytes {920} [optional] [built]
context element ./bar [389] ./templates lazy ^\.\/.*$ include: \.js$ exclude: \.noimport\.js$ namespace object ./bar
context element ./bar.js [389] ./templates lazy ^\.\/.*$ include: \.js$ exclude: \.noimport\.js$ namespace object ./bar.js
chunk {544} 544.output.js 38 bytes [rendered]
> ./baz [389] ./templates lazy ^\.\/.*$ include: \.js$ exclude: \.noimport\.js$ namespace object ./baz
> ./baz.js [389] ./templates lazy ^\.\/.*$ include: \.js$ exclude: \.noimport\.js$ namespace object ./baz.js
[544] ./templates/baz.js 38 bytes {544} [optional] [built]
[exports: default]
context element ./bar [259] ./templates lazy ^\.\/.*$ include: \.js$ exclude: \.noimport\.js$ namespace object ./bar
context element ./bar.js [259] ./templates lazy ^\.\/.*$ include: \.js$ exclude: \.noimport\.js$ namespace object ./bar.js
context element ./baz [389] ./templates lazy ^\.\/.*$ include: \.js$ exclude: \.noimport\.js$ namespace object ./baz
context element ./baz.js [389] ./templates lazy ^\.\/.*$ include: \.js$ exclude: \.noimport\.js$ namespace object ./baz.js
chunk {718} 718.output.js 38 bytes [rendered]
> ./foo [389] ./templates lazy ^\.\/.*$ include: \.js$ exclude: \.noimport\.js$ namespace object ./foo
> ./foo.js [389] ./templates lazy ^\.\/.*$ include: \.js$ exclude: \.noimport\.js$ namespace object ./foo.js
[718] ./templates/foo.js 38 bytes {718} [optional] [built]
[exports: default]
context element ./foo [389] ./templates lazy ^\.\/.*$ include: \.js$ exclude: \.noimport\.js$ namespace object ./foo
context element ./foo.js [389] ./templates lazy ^\.\/.*$ include: \.js$ exclude: \.noimport\.js$ namespace object ./foo.js
```

View File

@ -1,31 +1,31 @@
# example.js
This example illustrates how to filter the ContextModule results of `import()` statements. only `.js` files that don't
This example illustrates how to filter the ContextModule results of `import()` statements. only `.js` files that don't
end in `.noimport.js` within the `templates` folder will be bundled.
``` javascript
{{example.js}}
```javascript
_{{example.js}}_
```
# templates/
* foo.js
* foo.noimport.js
* baz.js
* foo.noimport.js
* bar.js
* foo.noimport.js
- foo.js
- foo.noimport.js
- baz.js
- foo.noimport.js
- bar.js
- foo.noimport.js
All templates are of this pattern:
``` javascript
{{templates/foo.js}}
```javascript
_{{templates/foo.js}}_
```
# dist/output.js
``` javascript
{{dist/output.js}}
```javascript
_{{dist/output.js}}_
```
# Info
@ -33,11 +33,11 @@ All templates are of this pattern:
## Unoptimized
```
{{stdout}}
_{{stdout}}_
```
## Production mode
```
{{production:stdout}}
_{{production:stdout}}_
```

View File

@ -2,7 +2,7 @@
This example illustrates how to leverage the `import()` syntax to create ContextModules which are separated into separate chunks for each module in the `./templates` folder.
``` javascript
```javascript
async function getTemplate(templateName) {
try {
let template = await import(`./templates/${templateName}`);
@ -20,13 +20,13 @@ getTemplate("baz");
# templates/
* foo.js
* baz.js
* bar.js
- foo.js
- baz.js
- bar.js
All templates are of this pattern:
``` javascript
```javascript
var foo = "foo";
export default foo;
@ -36,7 +36,7 @@ export default foo;
<details><summary><code>/******/ (function(modules) { /* webpackBootstrap */ })</code></summary>
``` javascript
```javascript
/******/ (function(modules, runtime) { // webpackBootstrap
/******/ "use strict";
/******/ // The module cache
@ -86,7 +86,7 @@ export default foo;
</details>
``` javascript
```javascript
/******/ ([
/* 0 */
/*!********************!*\
@ -125,40 +125,40 @@ getTemplate("baz");
var map = {
"./bar": [
2,
920
398
],
"./bar.js": [
2,
920
398
],
"./baz": [
3,
374
544
],
"./baz.js": [
3,
374
544
],
"./foo": [
4,
457
718
],
"./foo.js": [
4,
457
718
]
};
function webpackAsyncContext(req) {
var ids = map[req];
if(!ids) {
if(!Object.prototype.hasOwnProperty.call(map, req)) {
return Promise.resolve().then(function() {
var e = new Error("Cannot find module '" + req + "'");
e.code = 'MODULE_NOT_FOUND';
throw e;
});
}
var ids = map[req], id = ids[0];
return __webpack_require__.e(ids[1]).then(function() {
var id = ids[0];
return __webpack_require__(id);
});
}
@ -206,8 +206,7 @@ module.exports = webpackAsyncContext;
/******/
/******/ /* webpack/runtime/get javascript chunk filename */
/******/ !function() {
/******/
/******/ // This function only allows to reference on-demand chunks
/******/ // This function allow to reference async chunks
/******/ __webpack_require__.u = function(chunkId) {
/******/ // return url for filenames based on template
/******/ return "" + chunkId + ".output.js";
@ -222,7 +221,7 @@ module.exports = webpackAsyncContext;
/******/ // undefined = chunk not loaded, null = chunk preloaded/prefetched
/******/ // Promise = chunk loading, 0 = chunk loaded
/******/ var installedChunks = {
/******/ 404: 0
/******/ 179: 0
/******/ };
/******/
/******/
@ -341,85 +340,85 @@ module.exports = webpackAsyncContext;
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
374.output.js 646 bytes {374} [emitted]
457.output.js 646 bytes {457} [emitted]
920.output.js 646 bytes {920} [emitted]
output.js 9.01 KiB {404} [emitted] main
398.output.js 646 bytes {398} [emitted]
544.output.js 646 bytes {544} [emitted]
718.output.js 646 bytes {718} [emitted]
output.js 9.02 KiB {179} [emitted] main
Entrypoint main = output.js
chunk {374} 374.output.js 38 bytes [rendered]
> ./baz [1] ./templates lazy ^\.\/.*$ namespace object ./baz
> ./baz.js [1] ./templates lazy ^\.\/.*$ namespace object ./baz.js
[3] ./templates/baz.js 38 bytes {374} [optional] [built]
[exports: default]
[used exports unknown]
context element ./baz [1] ./templates lazy ^\.\/.*$ namespace object ./baz
context element ./baz.js [1] ./templates lazy ^\.\/.*$ namespace object ./baz.js
chunk {404} output.js (main) 441 bytes (javascript) 3.93 KiB (runtime) [entry] [rendered]
chunk {179} output.js (main) 441 bytes (javascript) 3.92 KiB (runtime) [entry] [rendered]
> ./example.js main
[0] ./example.js 281 bytes {404} [built]
[0] ./example.js 281 bytes {179} [built]
[used exports unknown]
entry ./example.js main
[1] ./templates lazy ^\.\/.*$ namespace object 160 bytes {404} [optional] [built]
[1] ./templates lazy ^\.\/.*$ namespace object 160 bytes {179} [optional] [built]
[used exports unknown]
import() context lazy ./templates [0] ./example.js 3:23-60
+ 5 hidden chunk modules
chunk {457} 457.output.js 38 bytes [rendered]
> ./foo [1] ./templates lazy ^\.\/.*$ namespace object ./foo
> ./foo.js [1] ./templates lazy ^\.\/.*$ namespace object ./foo.js
[4] ./templates/foo.js 38 bytes {457} [optional] [built]
[exports: default]
[used exports unknown]
context element ./foo [1] ./templates lazy ^\.\/.*$ namespace object ./foo
context element ./foo.js [1] ./templates lazy ^\.\/.*$ namespace object ./foo.js
chunk {920} 920.output.js 38 bytes [rendered]
chunk {398} 398.output.js 38 bytes [rendered]
> ./bar [1] ./templates lazy ^\.\/.*$ namespace object ./bar
> ./bar.js [1] ./templates lazy ^\.\/.*$ namespace object ./bar.js
[2] ./templates/bar.js 38 bytes {920} [optional] [built]
[2] ./templates/bar.js 38 bytes {398} [optional] [built]
[exports: default]
[used exports unknown]
context element ./bar [1] ./templates lazy ^\.\/.*$ namespace object ./bar
context element ./bar.js [1] ./templates lazy ^\.\/.*$ namespace object ./bar.js
chunk {544} 544.output.js 38 bytes [rendered]
> ./baz [1] ./templates lazy ^\.\/.*$ namespace object ./baz
> ./baz.js [1] ./templates lazy ^\.\/.*$ namespace object ./baz.js
[3] ./templates/baz.js 38 bytes {544} [optional] [built]
[exports: default]
[used exports unknown]
context element ./baz [1] ./templates lazy ^\.\/.*$ namespace object ./baz
context element ./baz.js [1] ./templates lazy ^\.\/.*$ namespace object ./baz.js
chunk {718} 718.output.js 38 bytes [rendered]
> ./foo [1] ./templates lazy ^\.\/.*$ namespace object ./foo
> ./foo.js [1] ./templates lazy ^\.\/.*$ namespace object ./foo.js
[4] ./templates/foo.js 38 bytes {718} [optional] [built]
[exports: default]
[used exports unknown]
context element ./foo [1] ./templates lazy ^\.\/.*$ namespace object ./foo
context element ./foo.js [1] ./templates lazy ^\.\/.*$ namespace object ./foo.js
```
## Production mode
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
374.output.js 119 bytes {374} [emitted]
457.output.js 119 bytes {457} [emitted]
920.output.js 119 bytes {920} [emitted]
output.js 2.06 KiB {404} [emitted] main
398.output.js 119 bytes {398} [emitted]
544.output.js 119 bytes {544} [emitted]
718.output.js 119 bytes {718} [emitted]
output.js 2.1 KiB {179} [emitted] main
Entrypoint main = output.js
chunk {374} 374.output.js 38 bytes [rendered]
> ./baz [305] ./templates lazy ^\.\/.*$ namespace object ./baz
> ./baz.js [305] ./templates lazy ^\.\/.*$ namespace object ./baz.js
[374] ./templates/baz.js 38 bytes {374} [optional] [built]
[exports: default]
context element ./baz [305] ./templates lazy ^\.\/.*$ namespace object ./baz
context element ./baz.js [305] ./templates lazy ^\.\/.*$ namespace object ./baz.js
chunk {404} output.js (main) 441 bytes (javascript) 3.93 KiB (runtime) [entry] [rendered]
chunk {179} output.js (main) 441 bytes (javascript) 3.92 KiB (runtime) [entry] [rendered]
> ./example.js main
[275] ./example.js 281 bytes {404} [built]
[144] ./example.js 281 bytes {179} [built]
entry ./example.js main
[305] ./templates lazy ^\.\/.*$ namespace object 160 bytes {404} [optional] [built]
import() context lazy ./templates [275] ./example.js 3:23-60
[866] ./templates lazy ^\.\/.*$ namespace object 160 bytes {179} [optional] [built]
import() context lazy ./templates [144] ./example.js 3:23-60
+ 5 hidden chunk modules
chunk {457} 457.output.js 38 bytes [rendered]
> ./foo [305] ./templates lazy ^\.\/.*$ namespace object ./foo
> ./foo.js [305] ./templates lazy ^\.\/.*$ namespace object ./foo.js
[457] ./templates/foo.js 38 bytes {457} [optional] [built]
chunk {398} 398.output.js 38 bytes [rendered]
> ./bar [866] ./templates lazy ^\.\/.*$ namespace object ./bar
> ./bar.js [866] ./templates lazy ^\.\/.*$ namespace object ./bar.js
[398] ./templates/bar.js 38 bytes {398} [optional] [built]
[exports: default]
context element ./foo [305] ./templates lazy ^\.\/.*$ namespace object ./foo
context element ./foo.js [305] ./templates lazy ^\.\/.*$ namespace object ./foo.js
chunk {920} 920.output.js 38 bytes [rendered]
> ./bar [305] ./templates lazy ^\.\/.*$ namespace object ./bar
> ./bar.js [305] ./templates lazy ^\.\/.*$ namespace object ./bar.js
[920] ./templates/bar.js 38 bytes {920} [optional] [built]
context element ./bar [866] ./templates lazy ^\.\/.*$ namespace object ./bar
context element ./bar.js [866] ./templates lazy ^\.\/.*$ namespace object ./bar.js
chunk {544} 544.output.js 38 bytes [rendered]
> ./baz [866] ./templates lazy ^\.\/.*$ namespace object ./baz
> ./baz.js [866] ./templates lazy ^\.\/.*$ namespace object ./baz.js
[544] ./templates/baz.js 38 bytes {544} [optional] [built]
[exports: default]
context element ./bar [305] ./templates lazy ^\.\/.*$ namespace object ./bar
context element ./bar.js [305] ./templates lazy ^\.\/.*$ namespace object ./bar.js
context element ./baz [866] ./templates lazy ^\.\/.*$ namespace object ./baz
context element ./baz.js [866] ./templates lazy ^\.\/.*$ namespace object ./baz.js
chunk {718} 718.output.js 38 bytes [rendered]
> ./foo [866] ./templates lazy ^\.\/.*$ namespace object ./foo
> ./foo.js [866] ./templates lazy ^\.\/.*$ namespace object ./foo.js
[718] ./templates/foo.js 38 bytes {718} [optional] [built]
[exports: default]
context element ./foo [866] ./templates lazy ^\.\/.*$ namespace object ./foo
context element ./foo.js [866] ./templates lazy ^\.\/.*$ namespace object ./foo.js
```

View File

@ -2,26 +2,26 @@
This example illustrates how to leverage the `import()` syntax to create ContextModules which are separated into separate chunks for each module in the `./templates` folder.
``` javascript
{{example.js}}
```javascript
_{{example.js}}_
```
# templates/
* foo.js
* baz.js
* bar.js
- foo.js
- baz.js
- bar.js
All templates are of this pattern:
``` javascript
{{templates/foo.js}}
```javascript
_{{templates/foo.js}}_
```
# dist/output.js
``` javascript
{{dist/output.js}}
```javascript
_{{dist/output.js}}_
```
# Info
@ -29,11 +29,11 @@ All templates are of this pattern:
## Unoptimized
```
{{stdout}}
_{{stdout}}_
```
## Production mode
```
{{production:stdout}}
_{{production:stdout}}_
```

View File

@ -2,7 +2,7 @@
This example illustrates how to specify chunk name in `require.ensure()` and `import()` to separated modules into separate chunks manually.
``` javascript
```javascript
import("./templates/foo" /* webpackChunkName: "chunk-foo" */ ).then(function(foo) {
console.log('foo:', foo);
})
@ -20,13 +20,13 @@ import("./templates/ba" + createContextVar /* webpackChunkName: "chunk-bar-baz"
# templates/
* foo.js
* baz.js
* bar.js
- foo.js
- baz.js
- bar.js
All templates are of this pattern:
``` javascript
```javascript
var foo = "foo";
export default foo;
@ -36,7 +36,7 @@ export default foo;
<details><summary><code>/******/ (function(modules) { /* webpackBootstrap */ })</code></summary>
``` javascript
```javascript
/******/ (function(modules, runtime) { // webpackBootstrap
/******/ "use strict";
/******/ // The module cache
@ -86,7 +86,7 @@ export default foo;
</details>
``` javascript
```javascript
/******/ ([
/* 0 */
/*!********************!*\
@ -96,11 +96,11 @@ export default foo;
/*! runtime requirements: __webpack_require____webpack_require__.e, */
/***/ (function(__unusedmodule, __unusedexports, __webpack_require__) {
__webpack_require__.e(/*! import() | chunk-foo */ 713).then(__webpack_require__.bind(null, /*! ./templates/foo */ 2)).then(function(foo) {
__webpack_require__.e(/*! import() | chunk-foo */ 930).then(__webpack_require__.bind(null, /*! ./templates/foo */ 2)).then(function(foo) {
console.log('foo:', foo);
})
__webpack_require__.e(/*! require.ensure | chunk-foo1 */ 713).then((function(require) {
__webpack_require__.e(/*! require.ensure | chunk-foo1 */ 930).then((function(require) {
var foo = __webpack_require__(/*! ./templates/foo */ 2);
console.log('foo:', foo);
}).bind(null, __webpack_require__)).catch(__webpack_require__.oe);
@ -125,32 +125,32 @@ __webpack_require__(1)("./ba" + createContextVar).then(function(bar) {
var map = {
"./bar": [
3,
965
791
],
"./bar.js": [
3,
965
791
],
"./baz": [
4,
644
548
],
"./baz.js": [
4,
644
548
]
};
function webpackAsyncContext(req) {
var ids = map[req];
if(!ids) {
if(!Object.prototype.hasOwnProperty.call(map, req)) {
return Promise.resolve().then(function() {
var e = new Error("Cannot find module '" + req + "'");
e.code = 'MODULE_NOT_FOUND';
throw e;
});
}
var ids = map[req], id = ids[0];
return __webpack_require__.e(ids[1]).then(function() {
var id = ids[0];
return __webpack_require__(id);
});
}
@ -198,8 +198,7 @@ module.exports = webpackAsyncContext;
/******/
/******/ /* webpack/runtime/get javascript chunk filename */
/******/ !function() {
/******/
/******/ // This function only allows to reference on-demand chunks
/******/ // This function allow to reference async chunks
/******/ __webpack_require__.u = function(chunkId) {
/******/ // return url for filenames based on template
/******/ return "" + chunkId + ".output.js";
@ -214,7 +213,7 @@ module.exports = webpackAsyncContext;
/******/ // undefined = chunk not loaded, null = chunk preloaded/prefetched
/******/ // Promise = chunk loading, 0 = chunk loaded
/******/ var installedChunks = {
/******/ 404: 0
/******/ 179: 0
/******/ };
/******/
/******/
@ -333,85 +332,85 @@ module.exports = webpackAsyncContext;
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
644.output.js 646 bytes {644} [emitted] chunk-bar-baz2
713.output.js 646 bytes {713} [emitted] chunk-foo
965.output.js 646 bytes {965} [emitted] chunk-bar-baz0
output.js 9.23 KiB {404} [emitted] main
548.output.js 646 bytes {548} [emitted] chunk-bar-baz2
791.output.js 646 bytes {791} [emitted] chunk-bar-baz0
930.output.js 646 bytes {930} [emitted] chunk-foo
output.js 9.24 KiB {179} [emitted] main
Entrypoint main = output.js
chunk {404} output.js (main) 565 bytes (javascript) 3.93 KiB (runtime) [entry] [rendered]
chunk {179} output.js (main) 565 bytes (javascript) 3.92 KiB (runtime) [entry] [rendered]
> ./example.js main
[0] ./example.js 405 bytes {404} [built]
[0] ./example.js 405 bytes {179} [built]
[used exports unknown]
entry ./example.js main
[1] ./templates lazy ^\.\/ba.*$ namespace object 160 bytes {404} [built]
[1] ./templates lazy ^\.\/ba.*$ namespace object 160 bytes {179} [built]
[used exports unknown]
import() context lazy ./templates [0] ./example.js 11:0-84
+ 5 hidden chunk modules
chunk {644} 644.output.js (chunk-bar-baz2) 38 bytes [rendered]
chunk {548} 548.output.js (chunk-bar-baz2) 38 bytes [rendered]
> ./baz [1] ./templates lazy ^\.\/ba.*$ namespace object ./baz
> ./baz.js [1] ./templates lazy ^\.\/ba.*$ namespace object ./baz.js
[4] ./templates/baz.js 38 bytes {644} [optional] [built]
[4] ./templates/baz.js 38 bytes {548} [optional] [built]
[exports: default]
[used exports unknown]
context element ./baz [1] ./templates lazy ^\.\/ba.*$ namespace object ./baz
context element ./baz.js [1] ./templates lazy ^\.\/ba.*$ namespace object ./baz.js
chunk {713} 713.output.js (chunk-foo) 38 bytes [rendered]
> ./templates/foo [0] ./example.js 1:0-62
> [0] ./example.js 5:0-8:16
[2] ./templates/foo.js 38 bytes {713} [built]
[exports: default]
[used exports unknown]
import() ./templates/foo [0] ./example.js 1:0-62
cjs require ./templates/foo [0] ./example.js 6:11-37
chunk {965} 965.output.js (chunk-bar-baz0) 38 bytes [rendered]
chunk {791} 791.output.js (chunk-bar-baz0) 38 bytes [rendered]
> ./bar [1] ./templates lazy ^\.\/ba.*$ namespace object ./bar
> ./bar.js [1] ./templates lazy ^\.\/ba.*$ namespace object ./bar.js
[3] ./templates/bar.js 38 bytes {965} [optional] [built]
[3] ./templates/bar.js 38 bytes {791} [optional] [built]
[exports: default]
[used exports unknown]
context element ./bar [1] ./templates lazy ^\.\/ba.*$ namespace object ./bar
context element ./bar.js [1] ./templates lazy ^\.\/ba.*$ namespace object ./bar.js
chunk {930} 930.output.js (chunk-foo) 38 bytes [rendered]
> ./templates/foo [0] ./example.js 1:0-62
> [0] ./example.js 5:0-8:16
[2] ./templates/foo.js 38 bytes {930} [built]
[exports: default]
[used exports unknown]
import() ./templates/foo [0] ./example.js 1:0-62
cjs require ./templates/foo [0] ./example.js 6:11-37
```
## Production mode
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
644.output.js 119 bytes {644} [emitted] chunk-bar-baz2
713.output.js 119 bytes {713} [emitted] chunk-foo
965.output.js 119 bytes {965} [emitted] chunk-bar-baz0
output.js 2.08 KiB {404} [emitted] main
548.output.js 119 bytes {548} [emitted] chunk-bar-baz2
791.output.js 119 bytes {791} [emitted] chunk-bar-baz0
930.output.js 119 bytes {930} [emitted] chunk-foo
output.js 2.13 KiB {179} [emitted] main
Entrypoint main = output.js
chunk {404} output.js (main) 565 bytes (javascript) 3.93 KiB (runtime) [entry] [rendered]
chunk {179} output.js (main) 565 bytes (javascript) 3.92 KiB (runtime) [entry] [rendered]
> ./example.js main
[275] ./example.js 405 bytes {404} [built]
[144] ./example.js 405 bytes {179} [built]
entry ./example.js main
[501] ./templates lazy ^\.\/ba.*$ namespace object 160 bytes {404} [built]
import() context lazy ./templates [275] ./example.js 11:0-84
[996] ./templates lazy ^\.\/ba.*$ namespace object 160 bytes {179} [built]
import() context lazy ./templates [144] ./example.js 11:0-84
+ 5 hidden chunk modules
chunk {644} 644.output.js (chunk-bar-baz2) 38 bytes [rendered]
> ./baz [501] ./templates lazy ^\.\/ba.*$ namespace object ./baz
> ./baz.js [501] ./templates lazy ^\.\/ba.*$ namespace object ./baz.js
[374] ./templates/baz.js 38 bytes {644} [optional] [built]
chunk {548} 548.output.js (chunk-bar-baz2) 38 bytes [rendered]
> ./baz [996] ./templates lazy ^\.\/ba.*$ namespace object ./baz
> ./baz.js [996] ./templates lazy ^\.\/ba.*$ namespace object ./baz.js
[544] ./templates/baz.js 38 bytes {548} [optional] [built]
[exports: default]
context element ./baz [501] ./templates lazy ^\.\/ba.*$ namespace object ./baz
context element ./baz.js [501] ./templates lazy ^\.\/ba.*$ namespace object ./baz.js
chunk {713} 713.output.js (chunk-foo) 38 bytes [rendered]
> ./templates/foo [275] ./example.js 1:0-62
> [275] ./example.js 5:0-8:16
[457] ./templates/foo.js 38 bytes {713} [built]
context element ./baz [996] ./templates lazy ^\.\/ba.*$ namespace object ./baz
context element ./baz.js [996] ./templates lazy ^\.\/ba.*$ namespace object ./baz.js
chunk {791} 791.output.js (chunk-bar-baz0) 38 bytes [rendered]
> ./bar [996] ./templates lazy ^\.\/ba.*$ namespace object ./bar
> ./bar.js [996] ./templates lazy ^\.\/ba.*$ namespace object ./bar.js
[398] ./templates/bar.js 38 bytes {791} [optional] [built]
[exports: default]
import() ./templates/foo [275] ./example.js 1:0-62
cjs require ./templates/foo [275] ./example.js 6:11-37
chunk {965} 965.output.js (chunk-bar-baz0) 38 bytes [rendered]
> ./bar [501] ./templates lazy ^\.\/ba.*$ namespace object ./bar
> ./bar.js [501] ./templates lazy ^\.\/ba.*$ namespace object ./bar.js
[920] ./templates/bar.js 38 bytes {965} [optional] [built]
context element ./bar [996] ./templates lazy ^\.\/ba.*$ namespace object ./bar
context element ./bar.js [996] ./templates lazy ^\.\/ba.*$ namespace object ./bar.js
chunk {930} 930.output.js (chunk-foo) 38 bytes [rendered]
> ./templates/foo [144] ./example.js 1:0-62
> [144] ./example.js 5:0-8:16
[718] ./templates/foo.js 38 bytes {930} [built]
[exports: default]
context element ./bar [501] ./templates lazy ^\.\/ba.*$ namespace object ./bar
context element ./bar.js [501] ./templates lazy ^\.\/ba.*$ namespace object ./bar.js
import() ./templates/foo [144] ./example.js 1:0-62
cjs require ./templates/foo [144] ./example.js 6:11-37
```

View File

@ -2,26 +2,26 @@
This example illustrates how to specify chunk name in `require.ensure()` and `import()` to separated modules into separate chunks manually.
``` javascript
{{example.js}}
```javascript
_{{example.js}}_
```
# templates/
* foo.js
* baz.js
* bar.js
- foo.js
- baz.js
- bar.js
All templates are of this pattern:
``` javascript
{{templates/foo.js}}
```javascript
_{{templates/foo.js}}_
```
# dist/output.js
``` javascript
{{dist/output.js}}
```javascript
_{{dist/output.js}}_
```
# Info
@ -29,11 +29,11 @@ All templates are of this pattern:
## Unoptimized
```
{{stdout}}
_{{stdout}}_
```
## Production mode
```
{{production:stdout}}
_{{production:stdout}}_
```

View File

@ -1,32 +1,32 @@
This example illustrates a very simple case of Code Splitting with `require.ensure`.
* `a` and `b` are required normally via CommonJS
* `c` is depended through the `require.ensure` array.
* This means: make it available, but don't execute it
* webpack will load it on demand
* `b` and `d` are required via CommonJs in the `require.ensure` callback
* webpack detects that these are in the on-demand-callback and
* will load them on demand
* webpacks optimizer can optimize `b` away
* as it is already available through the parent chunks
- `a` and `b` are required normally via CommonJS
- `c` is depended through the `require.ensure` array.
- This means: make it available, but don't execute it
- webpack will load it on demand
- `b` and `d` are required via CommonJs in the `require.ensure` callback
- webpack detects that these are in the on-demand-callback and
- will load them on demand
- webpacks optimizer can optimize `b` away
- as it is already available through the parent chunks
You can see that webpack outputs two files/chunks:
* `output.js` is the entry chunk and contains
* the module system
* chunk loading logic
* the entry point `example.js`
* module `a`
* module `b`
* `1.output.js` is an additional chunk (on demand loaded) and contains
* module `c`
* module `d`
- `output.js` is the entry chunk and contains
- the module system
- chunk loading logic
- the entry point `example.js`
- module `a`
- module `b`
- `1.output.js` is an additional chunk (on demand loaded) and contains
- module `c`
- module `d`
You can see that chunks are loaded via JSONP. The additional chunks are pretty small and minimize well.
# example.js
``` javascript
```javascript
var a = require("a");
var b = require("b");
require.ensure(["c"], function(require) {
@ -35,12 +35,11 @@ require.ensure(["c"], function(require) {
});
```
# dist/output.js
<details><summary><code>/******/ (function(modules) { /* webpackBootstrap */ })</code></summary>
``` javascript
```javascript
/******/ (function(modules, runtime) { // webpackBootstrap
/******/ "use strict";
/******/ // The module cache
@ -90,7 +89,7 @@ require.ensure(["c"], function(require) {
</details>
``` javascript
```javascript
/******/ ([
/* 0 */
/*!********************!*\
@ -102,7 +101,7 @@ require.ensure(["c"], function(require) {
var a = __webpack_require__(/*! a */ 1);
var b = __webpack_require__(/*! b */ 2);
__webpack_require__.e(/*! require.ensure */ 3).then((function(require) {
__webpack_require__.e(/*! require.ensure */ 796).then((function(require) {
__webpack_require__(/*! b */ 2).xyz();
var d = __webpack_require__(/*! d */ 4);
}).bind(null, __webpack_require__)).catch(__webpack_require__.oe);
@ -156,8 +155,7 @@ __webpack_require__.e(/*! require.ensure */ 3).then((function(require) {
/******/
/******/ /* webpack/runtime/get javascript chunk filename */
/******/ !function() {
/******/
/******/ // This function only allows to reference on-demand chunks
/******/ // This function allow to reference async chunks
/******/ __webpack_require__.u = function(chunkId) {
/******/ // return url for filenames based on template
/******/ return "" + chunkId + ".output.js";
@ -172,7 +170,7 @@ __webpack_require__.e(/*! require.ensure */ 3).then((function(require) {
/******/ // undefined = chunk not loaded, null = chunk preloaded/prefetched
/******/ // Promise = chunk loading, 0 = chunk loaded
/******/ var installedChunks = {
/******/ 404: 0
/******/ 179: 0
/******/ };
/******/
/******/
@ -285,10 +283,10 @@ __webpack_require__.e(/*! require.ensure */ 3).then((function(require) {
</details>
# dist/3.output.js
# dist/796.output.js
``` javascript
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[3],[
```javascript
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[796],[
/* 0 */,
/* 1 */,
/* 2 */,
@ -319,8 +317,8 @@ __webpack_require__.e(/*! require.ensure */ 3).then((function(require) {
Minimized
``` javascript
(window.webpackJsonp=window.webpackJsonp||[]).push([[3],{33:function(){},227:function(){}}]);
```javascript
(window.webpackJsonp=window.webpackJsonp||[]).push([[796],{286:function(){},882:function(){}}]);
```
# Info
@ -329,57 +327,57 @@ Minimized
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Asset Size Chunks Chunk Names
3.output.js 602 bytes {3} [emitted]
output.js 8.03 KiB {404} [emitted] main
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
796.output.js 604 bytes {796} [emitted]
output.js 8.01 KiB {179} [emitted] main
Entrypoint main = output.js
chunk {3} 3.output.js 22 bytes [rendered]
> [0] ./example.js 3:0-6:2
[3] ./node_modules/c.js 11 bytes {3} [built]
[used exports unknown]
require.ensure item c [0] ./example.js 3:0-6:2
[4] ./node_modules/d.js 11 bytes {3} [built]
[used exports unknown]
cjs require d [0] ./example.js 5:12-24
chunk {404} output.js (main) 161 bytes (javascript) 3.65 KiB (runtime) [entry] [rendered]
chunk {179} output.js (main) 161 bytes (javascript) 3.64 KiB (runtime) [entry] [rendered]
> ./example.js main
[0] ./example.js 139 bytes {404} [built]
[0] ./example.js 139 bytes {179} [built]
[used exports unknown]
entry ./example.js main
[1] ./node_modules/a.js 11 bytes {404} [built]
[1] ./node_modules/a.js 11 bytes {179} [built]
[used exports unknown]
cjs require a [0] ./example.js 1:8-20
[2] ./node_modules/b.js 11 bytes {404} [built]
[2] ./node_modules/b.js 11 bytes {179} [built]
[used exports unknown]
cjs require b [0] ./example.js 2:8-20
cjs require b [0] ./example.js 4:4-16
+ 4 hidden chunk modules
chunk {796} 796.output.js 22 bytes [rendered]
> [0] ./example.js 3:0-6:2
[3] ./node_modules/c.js 11 bytes {796} [built]
[used exports unknown]
require.ensure item c [0] ./example.js 3:0-6:2
[4] ./node_modules/d.js 11 bytes {796} [built]
[used exports unknown]
cjs require d [0] ./example.js 5:12-24
```
## Production mode
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Asset Size Chunks Chunk Names
3.output.js 93 bytes {3} [emitted]
output.js 1.45 KiB {404} [emitted] main
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
796.output.js 96 bytes {796} [emitted]
output.js 1.45 KiB {179} [emitted] main
Entrypoint main = output.js
chunk {3} 3.output.js 22 bytes [rendered]
> [275] ./example.js 3:0-6:2
[33] ./node_modules/d.js 11 bytes {3} [built]
cjs require d [275] ./example.js 5:12-24
[227] ./node_modules/c.js 11 bytes {3} [built]
require.ensure item c [275] ./example.js 3:0-6:2
chunk {404} output.js (main) 161 bytes (javascript) 3.65 KiB (runtime) [entry] [rendered]
chunk {179} output.js (main) 161 bytes (javascript) 3.64 KiB (runtime) [entry] [rendered]
> ./example.js main
[54] ./node_modules/a.js 11 bytes {404} [built]
cjs require a [275] ./example.js 1:8-20
[215] ./node_modules/b.js 11 bytes {404} [built]
cjs require b [275] ./example.js 2:8-20
cjs require b [275] ./example.js 4:4-16
[275] ./example.js 139 bytes {404} [built]
[144] ./example.js 139 bytes {179} [built]
entry ./example.js main
[213] ./node_modules/a.js 11 bytes {179} [built]
cjs require a [144] ./example.js 1:8-20
[644] ./node_modules/b.js 11 bytes {179} [built]
cjs require b [144] ./example.js 2:8-20
cjs require b [144] ./example.js 4:4-16
+ 4 hidden chunk modules
chunk {796} 796.output.js 22 bytes [rendered]
> [144] ./example.js 3:0-6:2
[286] ./node_modules/c.js 11 bytes {796} [built]
require.ensure item c [144] ./example.js 3:0-6:2
[882] ./node_modules/d.js 11 bytes {796} [built]
cjs require d [144] ./example.js 5:12-24
```

View File

@ -1,52 +1,51 @@
This example illustrates a very simple case of Code Splitting with `require.ensure`.
* `a` and `b` are required normally via CommonJS
* `c` is depended through the `require.ensure` array.
* This means: make it available, but don't execute it
* webpack will load it on demand
* `b` and `d` are required via CommonJs in the `require.ensure` callback
* webpack detects that these are in the on-demand-callback and
* will load them on demand
* webpacks optimizer can optimize `b` away
* as it is already available through the parent chunks
- `a` and `b` are required normally via CommonJS
- `c` is depended through the `require.ensure` array.
- This means: make it available, but don't execute it
- webpack will load it on demand
- `b` and `d` are required via CommonJs in the `require.ensure` callback
- webpack detects that these are in the on-demand-callback and
- will load them on demand
- webpacks optimizer can optimize `b` away
- as it is already available through the parent chunks
You can see that webpack outputs two files/chunks:
* `output.js` is the entry chunk and contains
* the module system
* chunk loading logic
* the entry point `example.js`
* module `a`
* module `b`
* `1.output.js` is an additional chunk (on demand loaded) and contains
* module `c`
* module `d`
- `output.js` is the entry chunk and contains
- the module system
- chunk loading logic
- the entry point `example.js`
- module `a`
- module `b`
- `1.output.js` is an additional chunk (on demand loaded) and contains
- module `c`
- module `d`
You can see that chunks are loaded via JSONP. The additional chunks are pretty small and minimize well.
# example.js
``` javascript
{{example.js}}
```javascript
_{{example.js}}_
```
# dist/output.js
``` javascript
{{dist/output.js}}
```javascript
_{{dist/output.js}}_
```
# dist/3.output.js
# dist/796.output.js
``` javascript
{{dist/3.output.js}}
```javascript
_{{dist/796.output.js}}_
```
Minimized
``` javascript
{{production:dist/3.output.js}}
```javascript
_{{production:dist/796.output.js}}_
```
# Info
@ -54,11 +53,11 @@ Minimized
## Unoptimized
```
{{stdout}}
_{{stdout}}_
```
## Production mode
```
{{production:stdout}}
_{{production:stdout}}_
```

View File

@ -1,13 +1,12 @@
# example.js
``` javascript
```javascript
console.log(require("./cup1"));
```
# cup1.coffee
``` coffee-script
```coffee-script
module.exports =
cool: "stuff"
answer: 42
@ -17,7 +16,7 @@ module.exports =
# cup2.coffee
``` coffee-script
```coffee-script
console.log "yeah coffee-script"
module.exports = 42
@ -27,7 +26,7 @@ module.exports = 42
<details><summary><code>/******/ (function(modules) { /* webpackBootstrap */ })</code></summary>
``` javascript
```javascript
/******/ (function(modules, runtime) { // webpackBootstrap
/******/ "use strict";
/******/ // The module cache
@ -73,7 +72,7 @@ module.exports = 42
</details>
``` javascript
```javascript
/******/ ([
/* 0 */
/*!********************!*\
@ -126,7 +125,7 @@ module.exports = 42;
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
output.js 2.33 KiB {0} [emitted] main
Entrypoint main = output.js
@ -148,17 +147,17 @@ chunk {0} output.js (main) 206 bytes [entry] [rendered]
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
output.js 372 bytes {404} [emitted] main
output.js 369 bytes {179} [emitted] main
Entrypoint main = output.js
chunk {404} output.js (main) 206 bytes [entry] [rendered]
chunk {179} output.js (main) 206 bytes [entry] [rendered]
> ./example.js main
[275] ./example.js 31 bytes {404} [built]
[56] ./cup2.coffee 57 bytes {179} [built]
cjs require ./cup2.coffee [867] ./cup1.coffee 4:12-36
cjs require ./cup2 [867] ./cup1.coffee 5:9-26
[144] ./example.js 31 bytes {179} [built]
entry ./example.js main
[642] ./cup1.coffee 118 bytes {404} [built]
cjs require ./cup1 [275] ./example.js 1:12-29
[976] ./cup2.coffee 57 bytes {404} [built]
cjs require ./cup2.coffee [642] ./cup1.coffee 4:12-36
cjs require ./cup2 [642] ./cup1.coffee 5:9-26
```
[867] ./cup1.coffee 118 bytes {179} [built]
cjs require ./cup1 [144] ./example.js 1:12-29
```

View File

@ -1,26 +1,25 @@
# example.js
``` javascript
{{example.js}}
```javascript
_{{example.js}}_
```
# cup1.coffee
``` coffee-script
{{cup1.coffee}}
```coffee-script
_{{cup1.coffee}}_
```
# cup2.coffee
``` coffee-script
{{cup2.coffee}}
```coffee-script
_{{cup2.coffee}}_
```
# dist/output.js
``` javascript
{{dist/output.js}}
```javascript
_{{dist/output.js}}_
```
# Info
@ -28,11 +27,11 @@
## Unoptimized
```
{{stdout}}
_{{stdout}}_
```
## Production mode
```
{{production:stdout}}
```
_{{production:stdout}}_
```

View File

@ -33,7 +33,7 @@ With this bundle configuration, you would load your third party libraries, then
# webpack.config.js
``` javascript
```javascript
var path = require("path");
module.exports = {
@ -72,7 +72,7 @@ module.exports = {
# dist/vendor.js
``` javascript
```javascript
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([["vendor"],{
/***/ 1:
@ -146,7 +146,7 @@ module.exports = "utility3";
<details><summary><code>/******/ (function(modules) { /* webpackBootstrap */ })</code></summary>
``` javascript
```javascript
/******/ (function(modules, runtime) { // webpackBootstrap
/******/ "use strict";
/******/ // The module cache
@ -192,7 +192,7 @@ module.exports = "utility3";
</details>
``` javascript
```javascript
/******/ ([
/* 0 */
/*!******************!*\
@ -328,7 +328,7 @@ module.exports = "utility1";
# dist/pageB.js
``` javascript
```javascript
/******/ (function(modules, runtime) { // webpackBootstrap
/******/ "use strict";
/******/ // The module cache
@ -487,7 +487,7 @@ module.exports = "pageB";
# dist/pageC.js
``` javascript
```javascript
/******/ (function(modules, runtime) { // webpackBootstrap
/******/ "use strict";
/******/ // The module cache
@ -648,7 +648,7 @@ module.exports = "pageC";
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
commons-utility2_js.js 357 bytes {commons-utility2_js} [emitted]
commons-utility3_js.js 357 bytes {commons-utility3_js} [emitted]
@ -711,13 +711,13 @@ chunk {vendor} vendor.js (vendor) 54 bytes [initial] [rendered] split chunk (cac
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
commons-utility2_js.js 117 bytes {commons-utility2_js} [emitted]
commons-utility2_js.js 118 bytes {commons-utility2_js} [emitted]
commons-utility3_js.js 118 bytes {commons-utility3_js} [emitted]
pageA.js 959 bytes {pageA} [emitted] pageA
pageB.js 943 bytes {pageB} [emitted] pageB
pageC.js 927 bytes {pageC} [emitted] pageC
pageA.js 960 bytes {pageA} [emitted] pageA
pageB.js 944 bytes {pageB} [emitted] pageB
pageC.js 928 bytes {pageC} [emitted] pageC
vendor.js 141 bytes {vendor} [emitted] vendor
Entrypoint pageA = vendor.js commons-utility2_js.js pageA.js
Entrypoint pageB = vendor.js commons-utility2_js.js commons-utility3_js.js pageB.js
@ -726,38 +726,38 @@ chunk {commons-utility2_js} commons-utility2_js.js 28 bytes [initial] [rendered]
> ./pageA pageA
> ./pageB pageB
> ./pageC pageC
[37] ./utility2.js 28 bytes {commons-utility2_js} [built]
cjs require ./utility2 [912] ./pageC.js 1:15-36
cjs require ./utility2 [953] ./pageA.js 3:15-36
cjs require ./utility2 [954] ./pageB.js 2:15-36
[318] ./utility2.js 28 bytes {commons-utility2_js} [built]
cjs require ./utility2 [145] ./pageC.js 1:15-36
cjs require ./utility2 [366] ./pageA.js 3:15-36
cjs require ./utility2 [588] ./pageB.js 2:15-36
chunk {commons-utility3_js} commons-utility3_js.js 28 bytes [initial] [rendered] split chunk (cache group: commons)
> ./pageB pageB
> ./pageC pageC
[544] ./utility3.js 28 bytes {commons-utility3_js} [built]
cjs require ./utility3 [912] ./pageC.js 2:15-36
cjs require ./utility3 [954] ./pageB.js 3:15-36
[685] ./utility3.js 28 bytes {commons-utility3_js} [built]
cjs require ./utility3 [145] ./pageC.js 2:15-36
cjs require ./utility3 [588] ./pageB.js 3:15-36
chunk {pageA} pageA.js (pageA) 165 bytes (javascript) 2.28 KiB (runtime) [entry] [rendered]
> ./pageA pageA
[105] ./utility1.js 28 bytes {pageA} [built]
cjs require ./utility1 [953] ./pageA.js 2:15-36
[953] ./pageA.js 137 bytes {pageA} [built]
[366] ./pageA.js 137 bytes {pageA} [built]
entry ./pageA pageA
[558] ./utility1.js 28 bytes {pageA} [built]
cjs require ./utility1 [366] ./pageA.js 2:15-36
+ 1 hidden chunk module
chunk {pageB} pageB.js (pageB) 137 bytes (javascript) 2.3 KiB (runtime) [entry] [rendered]
> ./pageB pageB
[954] ./pageB.js 137 bytes {pageB} [built]
[588] ./pageB.js 137 bytes {pageB} [built]
entry ./pageB pageB
+ 1 hidden chunk module
chunk {pageC} pageC.js (pageC) 102 bytes (javascript) 2.3 KiB (runtime) [entry] [rendered]
> ./pageC pageC
[912] ./pageC.js 102 bytes {pageC} [built]
[145] ./pageC.js 102 bytes {pageC} [built]
entry ./pageC pageC
+ 1 hidden chunk module
chunk {vendor} vendor.js (vendor) 54 bytes [initial] [rendered] split chunk (cache group: vendor) (name: vendor)
> ./pageA pageA
> ./pageB pageB
[333] ./node_modules/vendor1.js 27 bytes {vendor} [built]
cjs require vendor1 [953] ./pageA.js 1:14-32
[407] ./node_modules/vendor2.js 27 bytes {vendor} [built]
cjs require vendor2 [954] ./pageB.js 1:14-32
[815] ./node_modules/vendor2.js 27 bytes {vendor} [built]
cjs require vendor2 [588] ./pageB.js 1:14-32
[880] ./node_modules/vendor1.js 27 bytes {vendor} [built]
cjs require vendor1 [366] ./pageA.js 1:14-32
```

View File

@ -33,44 +33,44 @@ With this bundle configuration, you would load your third party libraries, then
# webpack.config.js
``` javascript
{{webpack.config.js}}
```javascript
_{{webpack.config.js}}_
```
# dist/vendor.js
``` javascript
{{dist/vendor.js}}
```javascript
_{{dist/vendor.js}}_
```
# dist/commons-utility2_js.js
``` javascript
{{dist/commons-utility2_js.js}}
_{{dist/commons-utility2_js.js}}_
```
# dist/commons-utility3_js.js
``` javascript
{{dist/commons-utility3_js.js}}
_{{dist/commons-utility3_js.js}}_
```
# dist/pageA.js
``` javascript
{{dist/pageA.js}}
```javascript
_{{dist/pageA.js}}_
```
# dist/pageB.js
``` javascript
{{dist/pageB.js}}
```javascript
_{{dist/pageB.js}}_
```
# dist/pageC.js
``` javascript
{{dist/pageC.js}}
```javascript
_{{dist/pageC.js}}_
```
# Info
@ -78,11 +78,11 @@ With this bundle configuration, you would load your third party libraries, then
## Unoptimized
```
{{stdout}}
_{{stdout}}_
```
## Production mode
```
{{production:stdout}}
_{{production:stdout}}_
```

View File

@ -1,28 +1,27 @@
This example illustrates how common modules from deep ancestors of an entry point can be split into a separate common chunk
* `pageA` and `pageB` are dynamically required
* `pageC` and `pageA` both require the `reusableComponent`
* `pageB` dynamically requires `PageC`
- `pageA` and `pageB` are dynamically required
- `pageC` and `pageA` both require the `reusableComponent`
- `pageB` dynamically requires `PageC`
You can see that webpack outputs five files/chunks:
* `output.js` is the entry chunk and contains
* the module system
* chunk loading logic
* the entry point `example.js`
* `0.output.js` is an additional chunk
* module `reusableComponent`
* `1.output.js` is an additional chunk
* module `pageB`
* `2.output.js` is an additional chunk
* module `pageA`
* `3.output.js` is an additional chunk
* module `pageC`
- `output.js` is the entry chunk and contains
- the module system
- chunk loading logic
- the entry point `example.js`
- `0.output.js` is an additional chunk
- module `reusableComponent`
- `1.output.js` is an additional chunk
- module `pageB`
- `2.output.js` is an additional chunk
- module `pageA`
- `3.output.js` is an additional chunk
- module `pageC`
# example.js
``` javascript
```javascript
var main = function() {
console.log("Main class");
require.ensure([], () => {
@ -40,7 +39,7 @@ main();
# pageA.js
``` javascript
```javascript
var reusableComponent = require("./reusableComponent");
module.exports = function() {
@ -51,7 +50,7 @@ module.exports = function() {
# pageB.js
``` javascript
```javascript
module.exports = function() {
console.log("Page B");
require.ensure([], ()=>{
@ -63,7 +62,7 @@ module.exports = function() {
# pageC.js
``` javascript
```javascript
var reusableComponent = require("./reusableComponent");
module.exports = function() {
@ -74,7 +73,7 @@ module.exports = function() {
# reusableComponent.js
``` javascript
```javascript
module.exports = function() {
console.log("reusable Component");
};
@ -82,7 +81,7 @@ module.exports = function() {
# webpack.config.js
``` javascript
```javascript
"use strict";
const path = require("path");
@ -108,7 +107,7 @@ module.exports = {
<details><summary><code>/******/ (function(modules) { /* webpackBootstrap */ })</code></summary>
``` javascript
```javascript
/******/ (function(modules, runtime) { // webpackBootstrap
/******/ "use strict";
/******/ // The module cache
@ -158,7 +157,7 @@ module.exports = {
</details>
``` javascript
```javascript
/******/ ([
/* 0 */
/*!********************!*\
@ -170,11 +169,11 @@ module.exports = {
var main = function() {
console.log("Main class");
Promise.all(/*! require.ensure */[__webpack_require__.e(596), __webpack_require__.e(953)]).then((() => {
Promise.all(/*! require.ensure */[__webpack_require__.e(421), __webpack_require__.e(366)]).then((() => {
const page = __webpack_require__(/*! ./pageA */ 1);
page();
}).bind(null, __webpack_require__)).catch(__webpack_require__.oe);
__webpack_require__.e(/*! require.ensure */ 954).then((() => {
__webpack_require__.e(/*! require.ensure */ 588).then((() => {
const page = __webpack_require__(/*! ./pageB */ 3);
page();
}).bind(null, __webpack_require__)).catch(__webpack_require__.oe);
@ -210,8 +209,7 @@ main();
/******/
/******/ /* webpack/runtime/get javascript chunk filename */
/******/ !function() {
/******/
/******/ // This function only allows to reference on-demand chunks
/******/ // This function allow to reference async chunks
/******/ __webpack_require__.u = function(chunkId) {
/******/ // return url for filenames based on template
/******/ return "" + chunkId + ".output.js";
@ -226,7 +224,7 @@ main();
/******/ // undefined = chunk not loaded, null = chunk preloaded/prefetched
/******/ // Promise = chunk loading, 0 = chunk loaded
/******/ var installedChunks = {
/******/ 404: 0
/******/ 179: 0
/******/ };
/******/
/******/
@ -339,21 +337,50 @@ main();
</details>
# dist/596.output.js
# dist/366.output.js
``` javascript
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[596],{
/***/ 2:
/*!******************************!*\
!*** ./reusableComponent.js ***!
\******************************/
```javascript
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[366],[
/* 0 */,
/* 1 */
/*!******************!*\
!*** ./pageA.js ***!
\******************/
/*! other exports [maybe provided (runtime-defined)] [no usage info] */
/*! runtime requirements: module */
/***/ (function(module) {
/*! runtime requirements: __webpack_require__module, */
/***/ (function(module, __unusedexports, __webpack_require__) {
var reusableComponent = __webpack_require__(/*! ./reusableComponent */ 2);
module.exports = function() {
console.log("reusable Component");
console.log("Page A");
reusableComponent();
};
/***/ })
]]);
```
# dist/588.output.js
```javascript
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[588],{
/***/ 3:
/*!******************!*\
!*** ./pageB.js ***!
\******************/
/*! other exports [maybe provided (runtime-defined)] [no usage info] */
/*! runtime requirements: module__webpack_require__.e, __webpack_require__, */
/***/ (function(module, __unusedexports, __webpack_require__) {
module.exports = function() {
console.log("Page B");
Promise.all(/*! require.ensure */[__webpack_require__.e(421), __webpack_require__.e(145)]).then((()=>{
const page = __webpack_require__(/*! ./pageC */ 4);
page();
}).bind(null, __webpack_require__)).catch(__webpack_require__.oe);
};
@ -362,10 +389,10 @@ module.exports = function() {
}]);
```
# dist/912.output.js
# dist/145.output.js
``` javascript
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[912],{
```javascript
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[145],{
/***/ 4:
/*!******************!*\
@ -388,50 +415,21 @@ module.exports = function() {
}]);
```
# dist/953.output.js
# dist/421.output.js
``` javascript
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[953],[
/* 0 */,
/* 1 */
/*!******************!*\
!*** ./pageA.js ***!
\******************/
```javascript
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[421],{
/***/ 2:
/*!******************************!*\
!*** ./reusableComponent.js ***!
\******************************/
/*! other exports [maybe provided (runtime-defined)] [no usage info] */
/*! runtime requirements: __webpack_require__module, */
/***/ (function(module, __unusedexports, __webpack_require__) {
var reusableComponent = __webpack_require__(/*! ./reusableComponent */ 2);
/*! runtime requirements: module */
/***/ (function(module) {
module.exports = function() {
console.log("Page A");
reusableComponent();
};
/***/ })
]]);
```
# dist/954.output.js
``` javascript
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[954],{
/***/ 3:
/*!******************!*\
!*** ./pageB.js ***!
\******************/
/*! other exports [maybe provided (runtime-defined)] [no usage info] */
/*! runtime requirements: module__webpack_require__.e, __webpack_require__, */
/***/ (function(module, __unusedexports, __webpack_require__) {
module.exports = function() {
console.log("Page B");
Promise.all(/*! require.ensure */[__webpack_require__.e(596), __webpack_require__.e(912)]).then((()=>{
const page = __webpack_require__(/*! ./pageC */ 4);
page();
}).bind(null, __webpack_require__)).catch(__webpack_require__.oe);
console.log("reusable Component");
};
@ -446,40 +444,40 @@ module.exports = function() {
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
596.output.js 407 bytes {596} [emitted]
912.output.js 516 bytes {912} [emitted]
953.output.js 522 bytes {953} [emitted]
954.output.js 677 bytes {954} [emitted]
output.js 7.72 KiB {404} [emitted] main
145.output.js 516 bytes {145} [emitted]
366.output.js 522 bytes {366} [emitted]
421.output.js 407 bytes {421} [emitted]
588.output.js 677 bytes {588} [emitted]
output.js 7.7 KiB {179} [emitted] main
Entrypoint main = output.js
chunk {404} output.js (main) 220 bytes (javascript) 3.65 KiB (runtime) [entry] [rendered]
chunk {145} 145.output.js 136 bytes [rendered]
> [3] ./pageB.js 3:1-6:3
[4] ./pageC.js 136 bytes {145} [built]
[used exports unknown]
cjs require ./pageC [3] ./pageB.js 4:15-33
chunk {179} output.js (main) 220 bytes (javascript) 3.64 KiB (runtime) [entry] [rendered]
> ./example.js main
[0] ./example.js 220 bytes {404} [built]
[0] ./example.js 220 bytes {179} [built]
[used exports unknown]
entry ./example.js main
+ 4 hidden chunk modules
chunk {596} 596.output.js 69 bytes [rendered] split chunk (cache group: default)
chunk {366} 366.output.js 136 bytes [rendered]
> [0] ./example.js 3:1-6:3
[1] ./pageA.js 136 bytes {366} [built]
[used exports unknown]
cjs require ./pageA [0] ./example.js 4:15-33
chunk {421} 421.output.js 69 bytes [rendered] split chunk (cache group: default)
> [0] ./example.js 3:1-6:3
> [3] ./pageB.js 3:1-6:3
[2] ./reusableComponent.js 69 bytes {596} [built]
[2] ./reusableComponent.js 69 bytes {421} [built]
[used exports unknown]
cjs require ./reusableComponent [1] ./pageA.js 1:24-54
cjs require ./reusableComponent [4] ./pageC.js 1:24-54
chunk {912} 912.output.js 136 bytes [rendered]
> [3] ./pageB.js 3:1-6:3
[4] ./pageC.js 136 bytes {912} [built]
[used exports unknown]
cjs require ./pageC [3] ./pageB.js 4:15-33
chunk {953} 953.output.js 136 bytes [rendered]
> [0] ./example.js 3:1-6:3
[1] ./pageA.js 136 bytes {953} [built]
[used exports unknown]
cjs require ./pageA [0] ./example.js 4:15-33
chunk {954} 954.output.js 133 bytes [rendered]
chunk {588} 588.output.js 133 bytes [rendered]
> [0] ./example.js 7:1-10:3
[3] ./pageB.js 133 bytes {954} [built]
[3] ./pageB.js 133 bytes {588} [built]
[used exports unknown]
cjs require ./pageB [0] ./example.js 8:15-33
```
@ -488,35 +486,35 @@ chunk {954} 954.output.js 133 bytes [rendered]
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
596.output.js 135 bytes {596} [emitted]
912.output.js 144 bytes {912} [emitted]
953.output.js 144 bytes {953} [emitted]
954.output.js 208 bytes {954} [emitted]
output.js 1.5 KiB {404} [emitted] main
145.output.js 144 bytes {145} [emitted]
366.output.js 144 bytes {366} [emitted]
421.output.js 135 bytes {421} [emitted]
588.output.js 208 bytes {588} [emitted]
output.js 1.5 KiB {179} [emitted] main
Entrypoint main = output.js
chunk {404} output.js (main) 220 bytes (javascript) 3.65 KiB (runtime) [entry] [rendered]
chunk {145} 145.output.js 136 bytes [rendered]
> [588] ./pageB.js 3:1-6:3
[145] ./pageC.js 136 bytes {145} [built]
cjs require ./pageC [588] ./pageB.js 4:15-33
chunk {179} output.js (main) 220 bytes (javascript) 3.64 KiB (runtime) [entry] [rendered]
> ./example.js main
[275] ./example.js 220 bytes {404} [built]
[144] ./example.js 220 bytes {179} [built]
entry ./example.js main
+ 4 hidden chunk modules
chunk {596} 596.output.js 69 bytes [rendered] split chunk (cache group: default)
> [275] ./example.js 3:1-6:3
> [954] ./pageB.js 3:1-6:3
[596] ./reusableComponent.js 69 bytes {596} [built]
cjs require ./reusableComponent [912] ./pageC.js 1:24-54
cjs require ./reusableComponent [953] ./pageA.js 1:24-54
chunk {912} 912.output.js 136 bytes [rendered]
> [954] ./pageB.js 3:1-6:3
[912] ./pageC.js 136 bytes {912} [built]
cjs require ./pageC [954] ./pageB.js 4:15-33
chunk {953} 953.output.js 136 bytes [rendered]
> [275] ./example.js 3:1-6:3
[953] ./pageA.js 136 bytes {953} [built]
cjs require ./pageA [275] ./example.js 4:15-33
chunk {954} 954.output.js 133 bytes [rendered]
> [275] ./example.js 7:1-10:3
[954] ./pageB.js 133 bytes {954} [built]
cjs require ./pageB [275] ./example.js 8:15-33
chunk {366} 366.output.js 136 bytes [rendered]
> [144] ./example.js 3:1-6:3
[366] ./pageA.js 136 bytes {366} [built]
cjs require ./pageA [144] ./example.js 4:15-33
chunk {421} 421.output.js 69 bytes [rendered] split chunk (cache group: default)
> [144] ./example.js 3:1-6:3
> [588] ./pageB.js 3:1-6:3
[421] ./reusableComponent.js 69 bytes {421} [built]
cjs require ./reusableComponent [145] ./pageC.js 1:24-54
cjs require ./reusableComponent [366] ./pageA.js 1:24-54
chunk {588} 588.output.js 133 bytes [rendered]
> [144] ./example.js 7:1-10:3
[588] ./pageB.js 133 bytes {588} [built]
cjs require ./pageB [144] ./example.js 8:15-33
```

View File

@ -1,89 +1,88 @@
This example illustrates how common modules from deep ancestors of an entry point can be split into a separate common chunk
* `pageA` and `pageB` are dynamically required
* `pageC` and `pageA` both require the `reusableComponent`
* `pageB` dynamically requires `PageC`
- `pageA` and `pageB` are dynamically required
- `pageC` and `pageA` both require the `reusableComponent`
- `pageB` dynamically requires `PageC`
You can see that webpack outputs five files/chunks:
* `output.js` is the entry chunk and contains
* the module system
* chunk loading logic
* the entry point `example.js`
* `0.output.js` is an additional chunk
* module `reusableComponent`
* `1.output.js` is an additional chunk
* module `pageB`
* `2.output.js` is an additional chunk
* module `pageA`
* `3.output.js` is an additional chunk
* module `pageC`
- `output.js` is the entry chunk and contains
- the module system
- chunk loading logic
- the entry point `example.js`
- `0.output.js` is an additional chunk
- module `reusableComponent`
- `1.output.js` is an additional chunk
- module `pageB`
- `2.output.js` is an additional chunk
- module `pageA`
- `3.output.js` is an additional chunk
- module `pageC`
# example.js
``` javascript
{{example.js}}
```javascript
_{{example.js}}_
```
# pageA.js
``` javascript
{{pageA.js}}
```javascript
_{{pageA.js}}_
```
# pageB.js
``` javascript
{{pageB.js}}
```javascript
_{{pageB.js}}_
```
# pageC.js
``` javascript
{{pageC.js}}
```javascript
_{{pageC.js}}_
```
# reusableComponent.js
``` javascript
{{reusableComponent.js}}
```javascript
_{{reusableComponent.js}}_
```
# webpack.config.js
``` javascript
{{webpack.config.js}}
```javascript
_{{webpack.config.js}}_
```
# dist/output.js
``` javascript
{{dist/output.js}}
```javascript
_{{dist/output.js}}_
```
# dist/596.output.js
# dist/366.output.js
``` javascript
{{dist/596.output.js}}
```javascript
_{{dist/366.output.js}}_
```
# dist/912.output.js
# dist/588.output.js
``` javascript
{{dist/912.output.js}}
```javascript
_{{dist/588.output.js}}_
```
# dist/953.output.js
# dist/145.output.js
``` javascript
{{dist/953.output.js}}
```javascript
_{{dist/145.output.js}}_
```
# dist/954.output.js
# dist/421.output.js
``` javascript
{{dist/954.output.js}}
```javascript
_{{dist/421.output.js}}_
```
# Info
@ -91,11 +90,11 @@ You can see that webpack outputs five files/chunks:
## Unoptimized
```
{{stdout}}
_{{stdout}}_
```
## Production mode
```
{{production:stdout}}
_{{production:stdout}}_
```

View File

@ -8,7 +8,7 @@ You can also see the info messages webpack prints to console (for both normal an
# example.js
``` javascript
```javascript
const inc = require('./increment').increment;
const a = 1;
inc(a); // 2
@ -16,7 +16,7 @@ inc(a); // 2
# increment.js
``` javascript
```javascript
const add = require('./math').add;
exports.increment = function(val) {
return add(val, 1);
@ -25,7 +25,7 @@ exports.increment = function(val) {
# math.js
``` javascript
```javascript
exports.add = function() {
var sum = 0, i = 0, args = arguments, l = args.length;
while (i < l) {
@ -39,7 +39,7 @@ exports.add = function() {
<details><summary><code>/******/ (function(modules) { /* webpackBootstrap */ })</code></summary>
``` javascript
```javascript
/******/ (function(modules, runtime) { // webpackBootstrap
/******/ "use strict";
/******/ // The module cache
@ -85,7 +85,7 @@ exports.add = function() {
</details>
``` javascript
```javascript
/******/ ([
/* 0 */
/*!********************!*\
@ -142,7 +142,7 @@ exports.add = function() {
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
output.js 2.46 KiB {0} [emitted] main
Entrypoint main = output.js
@ -163,16 +163,16 @@ chunk {0} output.js (main) 326 bytes [entry] [rendered]
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
output.js 406 bytes {404} [emitted] main
output.js 406 bytes {179} [emitted] main
Entrypoint main = output.js
chunk {404} output.js (main) 326 bytes [entry] [rendered]
chunk {179} output.js (main) 326 bytes [entry] [rendered]
> ./example.js main
[275] ./example.js 72 bytes {404} [built]
[144] ./example.js 72 bytes {179} [built]
entry ./example.js main
[529] ./increment.js 98 bytes {404} [built]
cjs require ./increment [275] ./example.js 1:12-34
[702] ./math.js 156 bytes {404} [built]
cjs require ./math [529] ./increment.js 1:12-29
```
[451] ./math.js 156 bytes {179} [built]
cjs require ./math [822] ./increment.js 1:12-29
[822] ./increment.js 98 bytes {179} [built]
cjs require ./increment [144] ./example.js 1:12-34
```

View File

@ -8,26 +8,26 @@ You can also see the info messages webpack prints to console (for both normal an
# example.js
``` javascript
{{example.js}}
```javascript
_{{example.js}}_
```
# increment.js
``` javascript
{{increment.js}}
```javascript
_{{increment.js}}_
```
# math.js
``` javascript
{{math.js}}
```javascript
_{{math.js}}_
```
# dist/output.js
``` javascript
{{dist/output.js}}
```javascript
_{{dist/output.js}}_
```
# Info
@ -35,11 +35,11 @@ You can also see the info messages webpack prints to console (for both normal an
## Unoptimized
```
{{stdout}}
_{{stdout}}_
```
## Production mode
```
{{production:stdout}}
```
_{{production:stdout}}_
```

View File

@ -8,7 +8,7 @@ A manifest is created which includes mappings from module names to internal ids.
### webpack.config.js
``` javascript
```javascript
var path = require("path");
var webpack = require("../../../");
@ -32,7 +32,7 @@ module.exports = {
# example-vendor
``` javascript
```javascript
export function square(n) {
return n * n;
}
@ -40,8 +40,8 @@ export function square(n) {
# dist/vendor.js
``` javascript
var vendor_lib_f9a078c3e662767ede52 =
```javascript
var vendor_lib_ced36e0133f6a1f67f40 =
```
<details><summary><code>/******/ (function(modules) { /* webpackBootstrap */ })</code></summary>
@ -164,8 +164,8 @@ function square(n) {
# dist/vendor-manifest.json
``` javascript
{"name":"vendor_lib_f9a078c3e662767ede52","content":{"../node_modules/example-vendor.js":{"id":1,"buildMeta":{"exportsType":"namespace"},"exports":["square"]}}}
```javascript
{"name":"vendor_lib_ced36e0133f6a1f67f40","content":{"../node_modules/example-vendor.js":{"id":1,"buildMeta":{"exportsType":"namespace"},"exports":["square"]}}}
```
# Info
@ -174,7 +174,7 @@ function square(n) {
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
vendor.js 3.42 KiB {0} [emitted] main
Entrypoint main = vendor.js
@ -194,19 +194,18 @@ chunk {0} vendor.js (main) 57 bytes (javascript) 560 bytes (runtime) [entry] [re
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
vendor.js 674 bytes {404} [emitted] main
vendor.js 674 bytes {179} [emitted] main
Entrypoint main = vendor.js
chunk {404} vendor.js (main) 57 bytes (javascript) 560 bytes (runtime) [entry] [rendered]
chunk {179} vendor.js (main) 57 bytes (javascript) 560 bytes (runtime) [entry] [rendered]
> main
[507] dll main 12 bytes {404} [built]
dll entry
DllPlugin
[797] ../node_modules/example-vendor.js 45 bytes {404} [built]
[442] ../node_modules/example-vendor.js 45 bytes {179} [built]
[exports: square]
entry example-vendor [507] dll main main[0]
entry example-vendor [550] dll main main[0]
DllPlugin
[550] dll main 12 bytes {179} [built]
dll entry
DllPlugin
+ 2 hidden chunk modules
```

View File

@ -8,26 +8,26 @@ A manifest is created which includes mappings from module names to internal ids.
### webpack.config.js
``` javascript
{{webpack.config.js}}
```javascript
_{{webpack.config.js}}_
```
# example-vendor
``` javascript
{{../node_modules/example-vendor.js}}
```javascript
_{{../node_modules/example-vendor.js}}_
```
# dist/vendor.js
``` javascript
{{dist/vendor.js}}
```javascript
_{{dist/vendor.js}}_
```
# dist/vendor-manifest.json
``` javascript
{{dist/vendor-manifest.json}}
```javascript
_{{dist/vendor-manifest.json}}_
```
# Info
@ -35,12 +35,11 @@ A manifest is created which includes mappings from module names to internal ids.
## Unoptimized
```
{{stdout}}
_{{stdout}}_
```
## Production mode
```
{{production:stdout}}
_{{production:stdout}}_
```

View File

@ -4,7 +4,7 @@ The previously built vendor dll is used. The DllReferencePlugin reads the conten
# webpack.config.js
``` javascript
```javascript
var path = require("path");
var webpack = require("../../../");
@ -27,7 +27,7 @@ module.exports = {
# example-app.js
``` javascript
```javascript
import { square } from "example-vendor";
console.log(square(7));
@ -36,7 +36,7 @@ console.log(new square(7));
# example.html
``` html
```html
<html>
<head></head>
<body>
@ -50,7 +50,7 @@ console.log(new square(7));
<details><summary><code>/******/ (function(modules) { /* webpackBootstrap */ })</code></summary>
``` javascript
```javascript
/******/ (function(modules, runtime) { // webpackBootstrap
/******/ "use strict";
/******/ // The module cache
@ -98,7 +98,7 @@ console.log(new square(7));
</details>
``` javascript
```javascript
/******/ ([
/* 0 */
/*!************************!*\
@ -120,25 +120,25 @@ console.log(new example_vendor__WEBPACK_IMPORTED_MODULE_0__["square"](7));
/***/ }),
/* 1 */
/*!******************************************************************************************************!*\
!*** delegated ../node_modules/example-vendor.js from dll-reference vendor_lib_f9a078c3e662767ede52 ***!
!*** delegated ../node_modules/example-vendor.js from dll-reference vendor_lib_ced36e0133f6a1f67f40 ***!
\******************************************************************************************************/
/*! export square [provided] [no usage info] [missing usage info prevents renaming] */
/*! other exports [not provided] [no usage info] */
/*! runtime requirements: module__webpack_require__, */
/***/ (function(module, __unusedexports, __webpack_require__) {
module.exports = (__webpack_require__(/*! dll-reference vendor_lib_f9a078c3e662767ede52 */ 2))(1);
module.exports = (__webpack_require__(/*! dll-reference vendor_lib_ced36e0133f6a1f67f40 */ 2))(1);
/***/ }),
/* 2 */
/*!**************************************************!*\
!*** external "vendor_lib_f9a078c3e662767ede52" ***!
!*** external "vendor_lib_ced36e0133f6a1f67f40" ***!
\**************************************************/
/*! other exports [maybe provided (runtime-defined)] [no usage info] */
/*! runtime requirements: module */
/***/ (function(module) {
module.exports = vendor_lib_f9a078c3e662767ede52;
module.exports = vendor_lib_ced36e0133f6a1f67f40;
/***/ })
/******/ ],
@ -174,7 +174,7 @@ module.exports = vendor_lib_f9a078c3e662767ede52;
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
app.js 3.6 KiB {0} [emitted] main
Entrypoint main = app.js
@ -184,15 +184,15 @@ chunk {0} app.js (main) 178 bytes (javascript) 279 bytes (runtime) [entry] [rend
[no exports]
[used exports unknown]
entry ./example-app main
[1] delegated ../node_modules/example-vendor.js from dll-reference vendor_lib_f9a078c3e662767ede52 42 bytes {0} [built]
[1] delegated ../node_modules/example-vendor.js from dll-reference vendor_lib_ced36e0133f6a1f67f40 42 bytes {0} [built]
[exports: square]
[used exports unknown]
harmony side effect evaluation example-vendor [0] ./example-app.js 1:0-40
harmony import specifier example-vendor [0] ./example-app.js 3:12-18
harmony import specifier example-vendor [0] ./example-app.js 4:16-22
[2] external "vendor_lib_f9a078c3e662767ede52" 42 bytes {0} [built]
[2] external "vendor_lib_ced36e0133f6a1f67f40" 42 bytes {0} [built]
[used exports unknown]
delegated source dll-reference vendor_lib_f9a078c3e662767ede52 [1] delegated ../node_modules/example-vendor.js from dll-reference vendor_lib_f9a078c3e662767ede52
delegated source dll-reference vendor_lib_ced36e0133f6a1f67f40 [1] delegated ../node_modules/example-vendor.js from dll-reference vendor_lib_ced36e0133f6a1f67f40
+ 1 hidden chunk module
```
@ -200,22 +200,22 @@ chunk {0} app.js (main) 178 bytes (javascript) 279 bytes (runtime) [entry] [rend
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
app.js 589 bytes {404} [emitted] main
app.js 591 bytes {179} [emitted] main
Entrypoint main = app.js
chunk {404} app.js (main) 178 bytes (javascript) 279 bytes (runtime) [entry] [rendered]
chunk {179} app.js (main) 178 bytes (javascript) 279 bytes (runtime) [entry] [rendered]
> ./example-app main
[10] delegated ../node_modules/example-vendor.js from dll-reference vendor_lib_f9a078c3e662767ede52 42 bytes {404} [built]
[312] delegated ../node_modules/example-vendor.js from dll-reference vendor_lib_ced36e0133f6a1f67f40 42 bytes {179} [built]
[exports: square]
harmony side effect evaluation example-vendor [423] ./example-app.js 1:0-40
harmony import specifier example-vendor [423] ./example-app.js 3:12-18
harmony import specifier example-vendor [423] ./example-app.js 4:16-22
[423] ./example-app.js 94 bytes {404} [built]
harmony side effect evaluation example-vendor [661] ./example-app.js 1:0-40
harmony import specifier example-vendor [661] ./example-app.js 3:12-18
harmony import specifier example-vendor [661] ./example-app.js 4:16-22
[661] ./example-app.js 94 bytes {179} [built]
[no exports]
entry ./example-app main
[860] external "vendor_lib_f9a078c3e662767ede52" 42 bytes {404} [built]
delegated source dll-reference vendor_lib_f9a078c3e662767ede52 [10] delegated ../node_modules/example-vendor.js from dll-reference vendor_lib_f9a078c3e662767ede52
[975] external "vendor_lib_ced36e0133f6a1f67f40" 42 bytes {179} [built]
delegated source dll-reference vendor_lib_ced36e0133f6a1f67f40 [312] delegated ../node_modules/example-vendor.js from dll-reference vendor_lib_ced36e0133f6a1f67f40
+ 1 hidden chunk module
```

View File

@ -4,26 +4,26 @@ The previously built vendor dll is used. The DllReferencePlugin reads the conten
# webpack.config.js
``` javascript
{{webpack.config.js}}
```javascript
_{{webpack.config.js}}_
```
# example-app.js
``` javascript
{{example-app.js}}
```javascript
_{{example-app.js}}_
```
# example.html
``` html
{{example.html}}
```html
_{{example.html}}_
```
# dist/app.js
``` javascript
{{dist/app.js}}
```javascript
_{{dist/app.js}}_
```
# Info
@ -31,13 +31,13 @@ The previously built vendor dll is used. The DllReferencePlugin reads the conten
## Unoptimized
```
{{stdout}}
_{{stdout}}_
```
## Production mode
```
{{production:stdout}}
_{{production:stdout}}_
```
<!-- @TODO:

View File

@ -24,17 +24,16 @@ from the corresponding modules `a.js`, `b.js` and `cjs.js`. None of the other mo
Also see [tree shaking](https://github.com/webpack/webpack/tree/master/examples/harmony-unused)
and [scope hoisting example](https://github.com/webpack/webpack/tree/master/examples/scope-hoisting).
# example.js
``` javascript
```javascript
export { a, b } from "./a";
export { c } from "./cjs";
```
# webpack.config.js
``` javascript
```javascript
var path = require("path");
var webpack = require("../../");
@ -63,8 +62,8 @@ module.exports = {
# dist/dll.js
``` javascript
var dll_6e9cb88568db6ca9f08a =
```javascript
var dll_97225ff6e4dba33e1316 =
```
<details><summary><code>/******/ (function(modules) { /* webpackBootstrap */ })</code></summary>
@ -254,8 +253,8 @@ exports.c = "c";
# dist/dll-manifest.json
``` javascript
{"name":"dll_6e9cb88568db6ca9f08a","content":{"./example.js":{"id":1,"buildMeta":{"exportsType":"namespace"},"exports":["a","b","c"]}}}
```javascript
{"name":"dll_97225ff6e4dba33e1316","content":{"./example.js":{"id":1,"buildMeta":{"exportsType":"namespace"},"exports":["a","b","c"]}}}
```
# Info
@ -264,7 +263,7 @@ exports.c = "c";
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
dll.js 6.07 KiB {0} [emitted] dll
Entrypoint dll = dll.js
@ -288,20 +287,20 @@ chunk {0} dll.js (dll) 216 bytes (javascript) 1.57 KiB (runtime) [entry] [render
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
dll.js 1.15 KiB {144} [emitted] dll
dll.js 1.15 KiB {874} [emitted] dll
Entrypoint dll = dll.js
chunk {144} dll.js (dll) 216 bytes (javascript) 1.57 KiB (runtime) [entry] [rendered]
chunk {874} dll.js (dll) 216 bytes (javascript) 1.57 KiB (runtime) [entry] [rendered]
> dll
[348] ./example.js + 2 modules 162 bytes {144} [built]
[exports: a, b, c]
entry ./example [980] dll dll dll[0]
[480] ./cjs.js 42 bytes {144} [built]
[only some exports used: c]
harmony side effect evaluation ./cjs [348] ./example.js + 2 modules ./example.js 2:0-26
harmony export imported specifier ./cjs [348] ./example.js + 2 modules ./example.js 2:0-26
[980] dll dll 12 bytes {144} [built]
[312] dll dll 12 bytes {874} [built]
dll entry
[489] ./cjs.js 42 bytes {874} [built]
[only some exports used: c]
harmony side effect evaluation ./cjs [680] ./example.js + 2 modules ./example.js 2:0-26
harmony export imported specifier ./cjs [680] ./example.js + 2 modules ./example.js 2:0-26
[680] ./example.js + 2 modules 162 bytes {874} [built]
[exports: a, b, c]
entry ./example [312] dll dll dll[0]
+ 4 hidden chunk modules
```

View File

@ -24,29 +24,28 @@ from the corresponding modules `a.js`, `b.js` and `cjs.js`. None of the other mo
Also see [tree shaking](https://github.com/webpack/webpack/tree/master/examples/harmony-unused)
and [scope hoisting example](https://github.com/webpack/webpack/tree/master/examples/scope-hoisting).
# example.js
``` javascript
{{example.js}}
```javascript
_{{example.js}}_
```
# webpack.config.js
``` javascript
{{webpack.config.js}}
```javascript
_{{webpack.config.js}}_
```
# dist/dll.js
``` javascript
{{dist/dll.js}}
```javascript
_{{dist/dll.js}}_
```
# dist/dll-manifest.json
``` javascript
{{dist/dll-manifest.json}}
```javascript
_{{dist/dll-manifest.json}}_
```
# Info
@ -54,11 +53,11 @@ and [scope hoisting example](https://github.com/webpack/webpack/tree/master/exam
## Unoptimized
```
{{stdout}}
_{{stdout}}_
```
## Production mode
```
{{production:stdout}}
_{{production:stdout}}_
```

View File

@ -6,7 +6,7 @@ This is the _user_ bundle, which uses the manifest from [dll-reference example](
# webpack.config.js
``` javascript
```javascript
var path = require("path");
var webpack = require("../../");
module.exports = {
@ -27,7 +27,7 @@ module.exports = {
# example.js
``` javascript
```javascript
console.log(require("../dll/alpha"));
console.log(require("../dll/a"));
@ -42,7 +42,7 @@ console.log(require("module"));
<details><summary><code>/******/ (function(modules) { /* webpackBootstrap */ })</code></summary>
``` javascript
```javascript
/******/ (function(modules, runtime) { // webpackBootstrap
/******/ "use strict";
/******/ // The module cache
@ -88,7 +88,7 @@ console.log(require("module"));
</details>
``` javascript
```javascript
/******/ ([
/* 0 */
/*!********************!*\
@ -111,90 +111,90 @@ console.log(__webpack_require__(/*! module */ 8));
/***/ }),
/* 1 */
/*!**************************************************************************!*\
!*** delegated ./alpha.js from dll-reference alpha_fa162dabf9a5b5246e96 ***!
!*** delegated ./alpha.js from dll-reference alpha_5a1a523b0fc11616dffc ***!
\**************************************************************************/
/*! other exports [maybe provided (runtime-defined)] [no usage info] */
/*! runtime requirements: module__webpack_require__, */
/***/ (function(module, __unusedexports, __webpack_require__) {
module.exports = (__webpack_require__(/*! dll-reference alpha_fa162dabf9a5b5246e96 */ 2))(1);
module.exports = (__webpack_require__(/*! dll-reference alpha_5a1a523b0fc11616dffc */ 2))(1);
/***/ }),
/* 2 */
/*!*********************************************!*\
!*** external "alpha_fa162dabf9a5b5246e96" ***!
!*** external "alpha_5a1a523b0fc11616dffc" ***!
\*********************************************/
/*! other exports [maybe provided (runtime-defined)] [no usage info] */
/*! runtime requirements: module */
/***/ (function(module) {
module.exports = alpha_fa162dabf9a5b5246e96;
module.exports = alpha_5a1a523b0fc11616dffc;
/***/ }),
/* 3 */
/*!**********************************************************************!*\
!*** delegated ./a.js from dll-reference alpha_fa162dabf9a5b5246e96 ***!
!*** delegated ./a.js from dll-reference alpha_5a1a523b0fc11616dffc ***!
\**********************************************************************/
/*! other exports [maybe provided (runtime-defined)] [no usage info] */
/*! runtime requirements: module__webpack_require__, */
/***/ (function(module, __unusedexports, __webpack_require__) {
module.exports = (__webpack_require__(/*! dll-reference alpha_fa162dabf9a5b5246e96 */ 2))(2);
module.exports = (__webpack_require__(/*! dll-reference alpha_5a1a523b0fc11616dffc */ 2))(2);
/***/ }),
/* 4 */
/*!************************************************************************!*\
!*** delegated ./beta.js from dll-reference beta_fa162dabf9a5b5246e96 ***!
!*** delegated ./beta.js from dll-reference beta_5a1a523b0fc11616dffc ***!
\************************************************************************/
/*! other exports [maybe provided (runtime-defined)] [no usage info] */
/*! runtime requirements: module__webpack_require__, */
/***/ (function(module, __unusedexports, __webpack_require__) {
module.exports = (__webpack_require__(/*! dll-reference beta_fa162dabf9a5b5246e96 */ 5))(5);
module.exports = (__webpack_require__(/*! dll-reference beta_5a1a523b0fc11616dffc */ 5))(5);
/***/ }),
/* 5 */
/*!********************************************!*\
!*** external "beta_fa162dabf9a5b5246e96" ***!
!*** external "beta_5a1a523b0fc11616dffc" ***!
\********************************************/
/*! other exports [maybe provided (runtime-defined)] [no usage info] */
/*! runtime requirements: module */
/***/ (function(module) {
module.exports = beta_fa162dabf9a5b5246e96;
module.exports = beta_5a1a523b0fc11616dffc;
/***/ }),
/* 6 */
/*!*********************************************************************!*\
!*** delegated ./b.js from dll-reference beta_fa162dabf9a5b5246e96 ***!
!*** delegated ./b.js from dll-reference beta_5a1a523b0fc11616dffc ***!
\*********************************************************************/
/*! other exports [maybe provided (runtime-defined)] [no usage info] */
/*! runtime requirements: module__webpack_require__, */
/***/ (function(module, __unusedexports, __webpack_require__) {
module.exports = (__webpack_require__(/*! dll-reference beta_fa162dabf9a5b5246e96 */ 5))(6);
module.exports = (__webpack_require__(/*! dll-reference beta_5a1a523b0fc11616dffc */ 5))(6);
/***/ }),
/* 7 */
/*!**********************************************************************!*\
!*** delegated ./c.jsx from dll-reference beta_fa162dabf9a5b5246e96 ***!
!*** delegated ./c.jsx from dll-reference beta_5a1a523b0fc11616dffc ***!
\**********************************************************************/
/*! other exports [maybe provided (runtime-defined)] [no usage info] */
/*! runtime requirements: module__webpack_require__, */
/***/ (function(module, __unusedexports, __webpack_require__) {
module.exports = (__webpack_require__(/*! dll-reference beta_fa162dabf9a5b5246e96 */ 5))(7);
module.exports = (__webpack_require__(/*! dll-reference beta_5a1a523b0fc11616dffc */ 5))(7);
/***/ }),
/* 8 */
/*!*****************************************************************************************!*\
!*** delegated ../node_modules/module.js from dll-reference alpha_fa162dabf9a5b5246e96 ***!
!*** delegated ../node_modules/module.js from dll-reference alpha_5a1a523b0fc11616dffc ***!
\*****************************************************************************************/
/*! other exports [maybe provided (runtime-defined)] [no usage info] */
/*! runtime requirements: module__webpack_require__, */
/***/ (function(module, __unusedexports, __webpack_require__) {
module.exports = (__webpack_require__(/*! dll-reference alpha_fa162dabf9a5b5246e96 */ 2))(3);
module.exports = (__webpack_require__(/*! dll-reference alpha_5a1a523b0fc11616dffc */ 2))(3);
/***/ })
/******/ ]);
@ -206,7 +206,7 @@ module.exports = (__webpack_require__(/*! dll-reference alpha_fa162dabf9a5b5246e
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
output.js 5.75 KiB {0} [emitted] main
Entrypoint main = output.js
@ -215,32 +215,32 @@ chunk {0} output.js (main) 541 bytes [entry] [rendered]
[0] ./example.js 205 bytes {0} [built]
[used exports unknown]
entry ./example.js main
[1] delegated ./alpha.js from dll-reference alpha_fa162dabf9a5b5246e96 42 bytes {0} [built]
[1] delegated ./alpha.js from dll-reference alpha_5a1a523b0fc11616dffc 42 bytes {0} [built]
[used exports unknown]
cjs require ../dll/alpha [0] ./example.js 1:12-35
[2] external "alpha_fa162dabf9a5b5246e96" 42 bytes {0} [built]
[2] external "alpha_5a1a523b0fc11616dffc" 42 bytes {0} [built]
[used exports unknown]
delegated source dll-reference alpha_fa162dabf9a5b5246e96 [1] delegated ./alpha.js from dll-reference alpha_fa162dabf9a5b5246e96
delegated source dll-reference alpha_fa162dabf9a5b5246e96 [3] delegated ./a.js from dll-reference alpha_fa162dabf9a5b5246e96
delegated source dll-reference alpha_fa162dabf9a5b5246e96 [8] delegated ../node_modules/module.js from dll-reference alpha_fa162dabf9a5b5246e96
[3] delegated ./a.js from dll-reference alpha_fa162dabf9a5b5246e96 42 bytes {0} [built]
delegated source dll-reference alpha_5a1a523b0fc11616dffc [1] delegated ./alpha.js from dll-reference alpha_5a1a523b0fc11616dffc
delegated source dll-reference alpha_5a1a523b0fc11616dffc [3] delegated ./a.js from dll-reference alpha_5a1a523b0fc11616dffc
delegated source dll-reference alpha_5a1a523b0fc11616dffc [8] delegated ../node_modules/module.js from dll-reference alpha_5a1a523b0fc11616dffc
[3] delegated ./a.js from dll-reference alpha_5a1a523b0fc11616dffc 42 bytes {0} [built]
[used exports unknown]
cjs require ../dll/a [0] ./example.js 2:12-31
[4] delegated ./beta.js from dll-reference beta_fa162dabf9a5b5246e96 42 bytes {0} [built]
[4] delegated ./beta.js from dll-reference beta_5a1a523b0fc11616dffc 42 bytes {0} [built]
[used exports unknown]
cjs require beta/beta [0] ./example.js 4:12-32
[5] external "beta_fa162dabf9a5b5246e96" 42 bytes {0} [built]
[5] external "beta_5a1a523b0fc11616dffc" 42 bytes {0} [built]
[used exports unknown]
delegated source dll-reference beta_fa162dabf9a5b5246e96 [4] delegated ./beta.js from dll-reference beta_fa162dabf9a5b5246e96
delegated source dll-reference beta_fa162dabf9a5b5246e96 [6] delegated ./b.js from dll-reference beta_fa162dabf9a5b5246e96
delegated source dll-reference beta_fa162dabf9a5b5246e96 [7] delegated ./c.jsx from dll-reference beta_fa162dabf9a5b5246e96
[6] delegated ./b.js from dll-reference beta_fa162dabf9a5b5246e96 42 bytes {0} [built]
delegated source dll-reference beta_5a1a523b0fc11616dffc [4] delegated ./beta.js from dll-reference beta_5a1a523b0fc11616dffc
delegated source dll-reference beta_5a1a523b0fc11616dffc [6] delegated ./b.js from dll-reference beta_5a1a523b0fc11616dffc
delegated source dll-reference beta_5a1a523b0fc11616dffc [7] delegated ./c.jsx from dll-reference beta_5a1a523b0fc11616dffc
[6] delegated ./b.js from dll-reference beta_5a1a523b0fc11616dffc 42 bytes {0} [built]
[used exports unknown]
cjs require beta/b [0] ./example.js 5:12-29
[7] delegated ./c.jsx from dll-reference beta_fa162dabf9a5b5246e96 42 bytes {0} [built]
[7] delegated ./c.jsx from dll-reference beta_5a1a523b0fc11616dffc 42 bytes {0} [built]
[used exports unknown]
cjs require beta/c [0] ./example.js 6:12-29
[8] delegated ../node_modules/module.js from dll-reference alpha_fa162dabf9a5b5246e96 42 bytes {0} [built]
[8] delegated ../node_modules/module.js from dll-reference alpha_5a1a523b0fc11616dffc 42 bytes {0} [built]
[used exports unknown]
cjs require module [0] ./example.js 8:12-29
```
@ -249,32 +249,32 @@ chunk {0} output.js (main) 541 bytes [entry] [rendered]
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
output.js 676 bytes {404} [emitted] main
output.js 674 bytes {179} [emitted] main
Entrypoint main = output.js
chunk {404} output.js (main) 541 bytes [entry] [rendered]
chunk {179} output.js (main) 541 bytes [entry] [rendered]
> ./example.js main
[142] delegated ./a.js from dll-reference alpha_fa162dabf9a5b5246e96 42 bytes {404} [built]
cjs require ../dll/a [275] ./example.js 2:12-31
[225] delegated ./alpha.js from dll-reference alpha_fa162dabf9a5b5246e96 42 bytes {404} [built]
cjs require ../dll/alpha [275] ./example.js 1:12-35
[275] ./example.js 205 bytes {404} [built]
[26] delegated ./b.js from dll-reference beta_5a1a523b0fc11616dffc 42 bytes {179} [built]
cjs require beta/b [144] ./example.js 5:12-29
[144] ./example.js 205 bytes {179} [built]
entry ./example.js main
[308] external "beta_fa162dabf9a5b5246e96" 42 bytes {404} [built]
delegated source dll-reference beta_fa162dabf9a5b5246e96 [873] delegated ./beta.js from dll-reference beta_fa162dabf9a5b5246e96
delegated source dll-reference beta_fa162dabf9a5b5246e96 [945] delegated ./c.jsx from dll-reference beta_fa162dabf9a5b5246e96
delegated source dll-reference beta_fa162dabf9a5b5246e96 [981] delegated ./b.js from dll-reference beta_fa162dabf9a5b5246e96
[355] delegated ../node_modules/module.js from dll-reference alpha_fa162dabf9a5b5246e96 42 bytes {404} [built]
cjs require module [275] ./example.js 8:12-29
[402] external "alpha_fa162dabf9a5b5246e96" 42 bytes {404} [built]
delegated source dll-reference alpha_fa162dabf9a5b5246e96 [142] delegated ./a.js from dll-reference alpha_fa162dabf9a5b5246e96
delegated source dll-reference alpha_fa162dabf9a5b5246e96 [225] delegated ./alpha.js from dll-reference alpha_fa162dabf9a5b5246e96
delegated source dll-reference alpha_fa162dabf9a5b5246e96 [355] delegated ../node_modules/module.js from dll-reference alpha_fa162dabf9a5b5246e96
[873] delegated ./beta.js from dll-reference beta_fa162dabf9a5b5246e96 42 bytes {404} [built]
cjs require beta/beta [275] ./example.js 4:12-32
[945] delegated ./c.jsx from dll-reference beta_fa162dabf9a5b5246e96 42 bytes {404} [built]
cjs require beta/c [275] ./example.js 6:12-29
[981] delegated ./b.js from dll-reference beta_fa162dabf9a5b5246e96 42 bytes {404} [built]
cjs require beta/b [275] ./example.js 5:12-29
[153] delegated ./alpha.js from dll-reference alpha_5a1a523b0fc11616dffc 42 bytes {179} [built]
cjs require ../dll/alpha [144] ./example.js 1:12-35
[262] delegated ../node_modules/module.js from dll-reference alpha_5a1a523b0fc11616dffc 42 bytes {179} [built]
cjs require module [144] ./example.js 8:12-29
[369] external "beta_5a1a523b0fc11616dffc" 42 bytes {179} [built]
delegated source dll-reference beta_5a1a523b0fc11616dffc [26] delegated ./b.js from dll-reference beta_5a1a523b0fc11616dffc
delegated source dll-reference beta_5a1a523b0fc11616dffc [636] delegated ./c.jsx from dll-reference beta_5a1a523b0fc11616dffc
delegated source dll-reference beta_5a1a523b0fc11616dffc [782] delegated ./beta.js from dll-reference beta_5a1a523b0fc11616dffc
[440] external "alpha_5a1a523b0fc11616dffc" 42 bytes {179} [built]
delegated source dll-reference alpha_5a1a523b0fc11616dffc [153] delegated ./alpha.js from dll-reference alpha_5a1a523b0fc11616dffc
delegated source dll-reference alpha_5a1a523b0fc11616dffc [262] delegated ../node_modules/module.js from dll-reference alpha_5a1a523b0fc11616dffc
delegated source dll-reference alpha_5a1a523b0fc11616dffc [801] delegated ./a.js from dll-reference alpha_5a1a523b0fc11616dffc
[636] delegated ./c.jsx from dll-reference beta_5a1a523b0fc11616dffc 42 bytes {179} [built]
cjs require beta/c [144] ./example.js 6:12-29
[782] delegated ./beta.js from dll-reference beta_5a1a523b0fc11616dffc 42 bytes {179} [built]
cjs require beta/beta [144] ./example.js 4:12-32
[801] delegated ./a.js from dll-reference alpha_5a1a523b0fc11616dffc 42 bytes {179} [built]
cjs require ../dll/a [144] ./example.js 2:12-31
```

View File

@ -6,20 +6,20 @@ This is the _user_ bundle, which uses the manifest from [dll-reference example](
# webpack.config.js
``` javascript
{{webpack.config.js}}
```javascript
_{{webpack.config.js}}_
```
# example.js
``` javascript
{{example.js}}
```javascript
_{{example.js}}_
```
# dist/output.js
``` javascript
{{dist/output.js}}
```javascript
_{{dist/output.js}}_
```
# Info
@ -27,11 +27,11 @@ This is the _user_ bundle, which uses the manifest from [dll-reference example](
## Unoptimized
```
{{stdout}}
_{{stdout}}_
```
## Production mode
```
{{production:stdout}}
_{{production:stdout}}_
```

View File

@ -4,10 +4,9 @@
This is the _reference_ bundle (with the manifests) for [dll user example](https://github.com/webpack/webpack/tree/master/examples/dll-user)
# webpack.config.js
``` javascript
```javascript
var path = require("path");
var webpack = require("../../");
module.exports = {
@ -35,8 +34,8 @@ module.exports = {
# dist/MyDll.alpha.js
``` javascript
var alpha_fa162dabf9a5b5246e96 =
```javascript
var alpha_5a1a523b0fc11616dffc =
```
<details><summary><code>/******/ (function(modules) { /* webpackBootstrap */ })</code></summary>
@ -137,8 +136,8 @@ module.exports = "module";
# dist/alpha-manifest.json
``` javascript
{"name":"alpha_fa162dabf9a5b5246e96","content":{"./alpha.js":{"id":1,"buildMeta":{}},"./a.js":{"id":2,"buildMeta":{}},"../node_modules/module.js":{"id":3,"buildMeta":{}}}}
```javascript
{"name":"alpha_5a1a523b0fc11616dffc","content":{"./alpha.js":{"id":1,"buildMeta":{}},"./a.js":{"id":2,"buildMeta":{}},"../node_modules/module.js":{"id":3,"buildMeta":{}}}}
```
# Info
@ -147,7 +146,7 @@ module.exports = "module";
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
MyDll.alpha.js 2.44 KiB {0} [emitted] alpha
MyDll.beta.js 2.41 KiB {1} [emitted] beta
@ -187,38 +186,38 @@ chunk {1} MyDll.beta.js (beta) 80 bytes [entry] [rendered]
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
MyDll.alpha.js 354 bytes {963} [emitted] alpha
MyDll.beta.js 348 bytes {188} [emitted] beta
MyDll.alpha.js 354 bytes {487} [emitted] alpha
MyDll.beta.js 345 bytes {904} [emitted] beta
Entrypoint alpha = MyDll.alpha.js
Entrypoint beta = MyDll.beta.js
chunk {188} MyDll.beta.js (beta) 80 bytes [entry] [rendered]
> beta
[21] ./b.js 21 bytes {188} [built]
entry ./b [350] dll beta beta[1]
DllPlugin
[145] ./beta.js 24 bytes {188} [built]
entry ./beta [350] dll beta beta[0]
DllPlugin
[235] ./c.jsx 23 bytes {188} [built]
entry ./c [350] dll beta beta[2]
DllPlugin
[350] dll beta 12 bytes {188} [built]
dll entry
DllPlugin
chunk {963} MyDll.alpha.js (alpha) 84 bytes [entry] [rendered]
chunk {487} MyDll.alpha.js (alpha) 84 bytes [entry] [rendered]
> alpha
[162] ./a.js 21 bytes {963} [built]
entry ./a [673] dll alpha alpha[1]
DllPlugin
[673] dll alpha 12 bytes {963} [built]
[258] dll alpha 12 bytes {487} [built]
dll entry
DllPlugin
[683] ../node_modules/module.js 26 bytes {963} [built]
entry module [673] dll alpha alpha[2]
[443] ../node_modules/module.js 26 bytes {487} [built]
entry module [258] dll alpha alpha[2]
DllPlugin
[930] ./alpha.js 25 bytes {963} [built]
entry ./alpha [673] dll alpha alpha[0]
[758] ./alpha.js 25 bytes {487} [built]
entry ./alpha [258] dll alpha alpha[0]
DllPlugin
[847] ./a.js 21 bytes {487} [built]
entry ./a [258] dll alpha alpha[1]
DllPlugin
chunk {904} MyDll.beta.js (beta) 80 bytes [entry] [rendered]
> beta
[15] dll beta 12 bytes {904} [built]
dll entry
DllPlugin
[60] ./c.jsx 23 bytes {904} [built]
entry ./c [15] dll beta beta[2]
DllPlugin
[97] ./beta.js 24 bytes {904} [built]
entry ./beta [15] dll beta beta[0]
DllPlugin
[996] ./b.js 21 bytes {904} [built]
entry ./b [15] dll beta beta[1]
DllPlugin
```

View File

@ -4,23 +4,22 @@
This is the _reference_ bundle (with the manifests) for [dll user example](https://github.com/webpack/webpack/tree/master/examples/dll-user)
# webpack.config.js
``` javascript
{{webpack.config.js}}
```javascript
_{{webpack.config.js}}_
```
# dist/MyDll.alpha.js
``` javascript
{{dist/MyDll.alpha.js}}
```javascript
_{{dist/MyDll.alpha.js}}_
```
# dist/alpha-manifest.json
``` javascript
{{dist/alpha-manifest.json}}
```javascript
_{{dist/alpha-manifest.json}}_
```
# Info
@ -28,11 +27,11 @@ This is the _reference_ bundle (with the manifests) for [dll user example](https
## Unoptimized
```
{{stdout}}
_{{stdout}}_
```
## Production mode
```
{{production:stdout}}
_{{production:stdout}}_
```

View File

@ -1,6 +1,6 @@
# webpack.config.js
``` javascript
```javascript
var path = require("path");
var webpack = require("../../");
module.exports = [
@ -45,8 +45,8 @@ module.exports = [
# dist/vendor.js
``` javascript
var vendor_a6691cc119b271dcfe48 =
```javascript
var vendor_01bfd4bf417e8c0b3920 =
```
<details><summary><code>/******/ (function(modules) { /* webpackBootstrap */ })</code></summary>
@ -136,7 +136,7 @@ module.exports = "Vendor2";
# dist/pageA.js
``` javascript
```javascript
/******/ (function(modules, runtime) { // webpackBootstrap
/******/ "use strict";
/******/ // The module cache
@ -193,24 +193,24 @@ module.exports = "pageA";
/***/ }),
/* 1 */
/*!****************************************************************************!*\
!*** delegated ./vendor.js from dll-reference vendor_a6691cc119b271dcfe48 ***!
!*** delegated ./vendor.js from dll-reference vendor_01bfd4bf417e8c0b3920 ***!
\****************************************************************************/
/*! other exports [maybe provided (runtime-defined)] [no usage info] */
/*! runtime requirements: module__webpack_require__, */
/***/ (function(module, __unusedexports, __webpack_require__) {
module.exports = (__webpack_require__(/*! dll-reference vendor_a6691cc119b271dcfe48 */ 2))(1);
module.exports = (__webpack_require__(/*! dll-reference vendor_01bfd4bf417e8c0b3920 */ 2))(1);
/***/ }),
/* 2 */
/*!**********************************************!*\
!*** external "vendor_a6691cc119b271dcfe48" ***!
!*** external "vendor_01bfd4bf417e8c0b3920" ***!
\**********************************************/
/*! other exports [maybe provided (runtime-defined)] [no usage info] */
/*! runtime requirements: module */
/***/ (function(module) {
module.exports = vendor_a6691cc119b271dcfe48;
module.exports = vendor_01bfd4bf417e8c0b3920;
/***/ })
/******/ ]);
@ -222,7 +222,7 @@ module.exports = vendor_a6691cc119b271dcfe48;
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Child vendor:
Hash: 0a1b2c3d4e5f6a7b8c9d
Asset Size Chunks Chunk Names
@ -253,23 +253,23 @@ Child app:
[0] ./pageA.js 59 bytes {0} [built]
[used exports unknown]
entry ./pageA pageA
[1] delegated ./vendor.js from dll-reference vendor_a6691cc119b271dcfe48 42 bytes {0} [built]
[1] delegated ./vendor.js from dll-reference vendor_01bfd4bf417e8c0b3920 42 bytes {0} [built]
[used exports unknown]
cjs require ./vendor [0] ./pageA.js 1:12-31
[2] external "vendor_a6691cc119b271dcfe48" 42 bytes {0} {1} [built]
[2] external "vendor_01bfd4bf417e8c0b3920" 42 bytes {0} {1} [built]
[used exports unknown]
delegated source dll-reference vendor_a6691cc119b271dcfe48 [1] delegated ./vendor.js from dll-reference vendor_a6691cc119b271dcfe48
delegated source dll-reference vendor_a6691cc119b271dcfe48 [4] delegated ./vendor2.js from dll-reference vendor_a6691cc119b271dcfe48
delegated source dll-reference vendor_01bfd4bf417e8c0b3920 [1] delegated ./vendor.js from dll-reference vendor_01bfd4bf417e8c0b3920
delegated source dll-reference vendor_01bfd4bf417e8c0b3920 [4] delegated ./vendor2.js from dll-reference vendor_01bfd4bf417e8c0b3920
chunk {1} pageB.js (pageB) 144 bytes [entry] [rendered]
> ./pageB pageB
[2] external "vendor_a6691cc119b271dcfe48" 42 bytes {0} {1} [built]
[2] external "vendor_01bfd4bf417e8c0b3920" 42 bytes {0} {1} [built]
[used exports unknown]
delegated source dll-reference vendor_a6691cc119b271dcfe48 [1] delegated ./vendor.js from dll-reference vendor_a6691cc119b271dcfe48
delegated source dll-reference vendor_a6691cc119b271dcfe48 [4] delegated ./vendor2.js from dll-reference vendor_a6691cc119b271dcfe48
delegated source dll-reference vendor_01bfd4bf417e8c0b3920 [1] delegated ./vendor.js from dll-reference vendor_01bfd4bf417e8c0b3920
delegated source dll-reference vendor_01bfd4bf417e8c0b3920 [4] delegated ./vendor2.js from dll-reference vendor_01bfd4bf417e8c0b3920
[3] ./pageB.js 60 bytes {1} [built]
[used exports unknown]
entry ./pageB pageB
[4] delegated ./vendor2.js from dll-reference vendor_a6691cc119b271dcfe48 42 bytes {1} [built]
[4] delegated ./vendor2.js from dll-reference vendor_01bfd4bf417e8c0b3920 42 bytes {1} [built]
[used exports unknown]
cjs require ./vendor2 [3] ./pageB.js 1:12-32
chunk {2} pageC.js (pageC) 25 bytes [entry] [rendered]
@ -283,52 +283,52 @@ Child app:
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Child vendor:
Hash: 0a1b2c3d4e5f6a7b8c9d
Asset Size Chunks Chunk Names
vendor.js 326 bytes {404} [emitted] main
vendor.js 326 bytes {179} [emitted] main
Entrypoint main = vendor.js
chunk {404} vendor.js (main) 65 bytes [entry] [rendered]
chunk {179} vendor.js (main) 65 bytes [entry] [rendered]
> main
[123] ./vendor2.js 27 bytes {404} [built]
entry ./vendor2 [507] dll main main[1]
[117] ./vendor2.js 27 bytes {179} [built]
entry ./vendor2 [550] dll main main[1]
DllPlugin
[493] ./vendor.js 26 bytes {404} [built]
entry ./vendor [507] dll main main[0]
DllPlugin
[507] dll main 12 bytes {404} [built]
[550] dll main 12 bytes {179} [built]
dll entry
DllPlugin
[965] ./vendor.js 26 bytes {179} [built]
entry ./vendor [550] dll main main[0]
DllPlugin
Child app:
Hash: 0a1b2c3d4e5f6a7b8c9d
Asset Size Chunks Chunk Names
pageA.js 339 bytes {641} [emitted] pageA
pageB.js 339 bytes {791} [emitted] pageB
pageC.js 217 bytes {42} [emitted] pageC
pageA.js 339 bytes {424} [emitted] pageA
pageB.js 339 bytes {121} [emitted] pageB
pageC.js 217 bytes {178} [emitted] pageC
Entrypoint pageA = pageA.js
Entrypoint pageB = pageB.js
Entrypoint pageC = pageC.js
chunk {42} pageC.js (pageC) 25 bytes [entry] [rendered]
> ./pageC pageC
[912] ./pageC.js 25 bytes {42} [built]
entry ./pageC pageC
chunk {641} pageA.js (pageA) 143 bytes [entry] [rendered]
> ./pageA pageA
[540] delegated ./vendor.js from dll-reference vendor_2ebc0a3096b687719ec1 42 bytes {641} [built]
cjs require ./vendor [953] ./pageA.js 1:12-31
[748] external "vendor_2ebc0a3096b687719ec1" 42 bytes {641} {791} [built]
delegated source dll-reference vendor_2ebc0a3096b687719ec1 [540] delegated ./vendor.js from dll-reference vendor_2ebc0a3096b687719ec1
delegated source dll-reference vendor_2ebc0a3096b687719ec1 [848] delegated ./vendor2.js from dll-reference vendor_2ebc0a3096b687719ec1
[953] ./pageA.js 59 bytes {641} [built]
entry ./pageA pageA
chunk {791} pageB.js (pageB) 144 bytes [entry] [rendered]
chunk {121} pageB.js (pageB) 144 bytes [entry] [rendered]
> ./pageB pageB
[748] external "vendor_2ebc0a3096b687719ec1" 42 bytes {641} {791} [built]
delegated source dll-reference vendor_2ebc0a3096b687719ec1 [540] delegated ./vendor.js from dll-reference vendor_2ebc0a3096b687719ec1
delegated source dll-reference vendor_2ebc0a3096b687719ec1 [848] delegated ./vendor2.js from dll-reference vendor_2ebc0a3096b687719ec1
[848] delegated ./vendor2.js from dll-reference vendor_2ebc0a3096b687719ec1 42 bytes {791} [built]
cjs require ./vendor2 [954] ./pageB.js 1:12-32
[954] ./pageB.js 60 bytes {791} [built]
[286] external "vendor_d504d9efb3c6bf75ca3a" 42 bytes {121} {424} [built]
delegated source dll-reference vendor_d504d9efb3c6bf75ca3a [296] delegated ./vendor2.js from dll-reference vendor_d504d9efb3c6bf75ca3a
delegated source dll-reference vendor_d504d9efb3c6bf75ca3a [757] delegated ./vendor.js from dll-reference vendor_d504d9efb3c6bf75ca3a
[296] delegated ./vendor2.js from dll-reference vendor_d504d9efb3c6bf75ca3a 42 bytes {121} [built]
cjs require ./vendor2 [588] ./pageB.js 1:12-32
[588] ./pageB.js 60 bytes {121} [built]
entry ./pageB pageB
chunk {178} pageC.js (pageC) 25 bytes [entry] [rendered]
> ./pageC pageC
[145] ./pageC.js 25 bytes {178} [built]
entry ./pageC pageC
chunk {424} pageA.js (pageA) 143 bytes [entry] [rendered]
> ./pageA pageA
[286] external "vendor_d504d9efb3c6bf75ca3a" 42 bytes {121} {424} [built]
delegated source dll-reference vendor_d504d9efb3c6bf75ca3a [296] delegated ./vendor2.js from dll-reference vendor_d504d9efb3c6bf75ca3a
delegated source dll-reference vendor_d504d9efb3c6bf75ca3a [757] delegated ./vendor.js from dll-reference vendor_d504d9efb3c6bf75ca3a
[366] ./pageA.js 59 bytes {424} [built]
entry ./pageA pageA
[757] delegated ./vendor.js from dll-reference vendor_d504d9efb3c6bf75ca3a 42 bytes {424} [built]
cjs require ./vendor [366] ./pageA.js 1:12-31
```

View File

@ -1,19 +1,19 @@
# webpack.config.js
``` javascript
{{webpack.config.js}}
```javascript
_{{webpack.config.js}}_
```
# dist/vendor.js
``` javascript
{{dist/vendor.js}}
```javascript
_{{dist/vendor.js}}_
```
# dist/pageA.js
``` javascript
{{dist/pageA.js}}
```javascript
_{{dist/pageA.js}}_
```
# Info
@ -21,11 +21,11 @@
## Unoptimized
```
{{stdout}}
_{{stdout}}_
```
## Production mode
```
{{production:stdout}}
_{{production:stdout}}_
```

View File

@ -9,7 +9,7 @@ In the simple case we just need to specify a string (`"add"`). Then it's resolve
In the complex case we specify different values for each environment:
| environment | config value | resolved as |
|--------------------|--------------------------|------------------------------|
| ------------------ | ------------------------ | ---------------------------- |
| CommonJs (strict) | `["./math", "subtract"]` | `require("./math").subtract` |
| CommonJs (node.js) | `"./subtract"` | `require("./subtract")` |
| AMD | `"subtract"` | `define(["subtract"], ...)` |
@ -17,7 +17,7 @@ In the complex case we specify different values for each environment:
# example.js
``` javascript
```javascript
var add = require("add");
var subtract = require("subtract");
@ -26,7 +26,7 @@ exports.exampleValue = subtract(add(42, 2), 2);
# webpack.config.js
``` javascript
```javascript
module.exports = {
// mode: "development || "production",
output: {
@ -48,7 +48,7 @@ module.exports = {
# dist/output.js
``` javascript
```javascript
(function webpackUniversalModuleDefinition(root, factory) {
if(typeof exports === 'object' && typeof module === 'object')
module.exports = factory(require("add"), require("./subtract"));
@ -156,7 +156,7 @@ module.exports = __WEBPACK_EXTERNAL_MODULE__2__;
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
output.js 3.13 KiB {0} [emitted] main
Entrypoint main = output.js
@ -177,16 +177,16 @@ chunk {0} output.js (main) 194 bytes [entry] [rendered]
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
output.js 708 bytes {404} [emitted] main
output.js 708 bytes {179} [emitted] main
Entrypoint main = output.js
chunk {404} output.js (main) 194 bytes [entry] [rendered]
chunk {179} output.js (main) 194 bytes [entry] [rendered]
> ./example.js main
[275] ./example.js 110 bytes {404} [built]
[144] ./example.js 110 bytes {179} [built]
entry ./example.js main
[349] external "add" 42 bytes {404} [built]
cjs require add [275] ./example.js 1:10-24
[795] external {"root":"subtract","commonjs2":"./subtract","commonjs":["./math","subtract"],"amd":"subtract"} 42 bytes {404} [built]
cjs require subtract [275] ./example.js 2:15-34
```
[324] external {"root":"subtract","commonjs2":"./subtract","commonjs":["./math","subtract"],"amd":"subtract"} 42 bytes {179} [built]
cjs require subtract [144] ./example.js 2:15-34
[630] external "add" 42 bytes {179} [built]
cjs require add [144] ./example.js 1:10-24
```

View File

@ -9,7 +9,7 @@ In the simple case we just need to specify a string (`"add"`). Then it's resolve
In the complex case we specify different values for each environment:
| environment | config value | resolved as |
|--------------------|--------------------------|------------------------------|
| ------------------ | ------------------------ | ---------------------------- |
| CommonJs (strict) | `["./math", "subtract"]` | `require("./math").subtract` |
| CommonJs (node.js) | `"./subtract"` | `require("./subtract")` |
| AMD | `"subtract"` | `define(["subtract"], ...)` |
@ -17,20 +17,20 @@ In the complex case we specify different values for each environment:
# example.js
``` javascript
{{example.js}}
```javascript
_{{example.js}}_
```
# webpack.config.js
``` javascript
{{webpack.config.js}}
```javascript
_{{webpack.config.js}}_
```
# dist/output.js
``` javascript
{{dist/output.js}}
```javascript
_{{dist/output.js}}_
```
# Info
@ -38,11 +38,11 @@ In the complex case we specify different values for each environment:
## Unoptimized
```
{{stdout}}
_{{stdout}}_
```
## Production mode
```
{{production:stdout}}
```
_{{production:stdout}}_
```

View File

@ -1,8 +1,6 @@
# example.js
``` javascript
```javascript
require(["./a", "./b", "./c"], function(a, b, c) {});
require.ensure(["./a"], function(require) {
@ -23,7 +21,7 @@ require.ensure(["./a", "./e"], function(require) {
# webpack.config.js
``` javascript
```javascript
module.exports = {
// mode: "development || "production",
optimization: {
@ -39,7 +37,7 @@ module.exports = {
<details><summary><code>/******/ (function(modules) { /* webpackBootstrap */ })</code></summary>
``` javascript
```javascript
/******/ (function(modules, runtime) { // webpackBootstrap
/******/ "use strict";
/******/ // The module cache
@ -89,7 +87,7 @@ module.exports = {
</details>
``` javascript
```javascript
/******/ ([
/* 0 */
/*!********************!*\
@ -99,19 +97,19 @@ module.exports = {
/*! runtime requirements: __webpack_require__.e__webpack_require__.oe, __webpack_require__, */
/***/ (function(__unusedmodule, __unusedexports, __webpack_require__) {
Promise.all(/*! AMD require */[__webpack_require__.e(21), __webpack_require__.e(162), __webpack_require__.e(911)]).then(function() { var __WEBPACK_AMD_REQUIRE_ARRAY__ = [__webpack_require__(/*! ./a */ 1), __webpack_require__(/*! ./b */ 2), __webpack_require__(/*! ./c */ 3)]; (function(a, b, c) {}).apply(null, __WEBPACK_AMD_REQUIRE_ARRAY__);}).catch(__webpack_require__.oe);
Promise.all(/*! AMD require */[__webpack_require__.e(996), __webpack_require__.e(847), __webpack_require__.e(460)]).then(function() { var __WEBPACK_AMD_REQUIRE_ARRAY__ = [__webpack_require__(/*! ./a */ 1), __webpack_require__(/*! ./b */ 2), __webpack_require__(/*! ./c */ 3)]; (function(a, b, c) {}).apply(null, __WEBPACK_AMD_REQUIRE_ARRAY__);}).catch(__webpack_require__.oe);
Promise.all(/*! require.ensure */[__webpack_require__.e(21), __webpack_require__.e(162), __webpack_require__.e(85)]).then((function(require) {
Promise.all(/*! require.ensure */[__webpack_require__.e(996), __webpack_require__.e(847), __webpack_require__.e(767)]).then((function(require) {
__webpack_require__(/*! ./b */ 2);
__webpack_require__(/*! ./d */ 4);
}).bind(null, __webpack_require__)).catch(__webpack_require__.oe);
Promise.all(/*! require.ensure */[__webpack_require__.e(162), __webpack_require__.e(601)]).then((function(require) {
Promise.all(/*! require.ensure */[__webpack_require__.e(847), __webpack_require__.e(390)]).then((function(require) {
__webpack_require__(/*! ./a */ 1);
Promise.all(/*! require.ensure */[__webpack_require__.e(21), __webpack_require__.e(153)]).then((function(require) {
Promise.all(/*! require.ensure */[__webpack_require__.e(996), __webpack_require__.e(568)]).then((function(require) {
__webpack_require__(/*! ./f */ 6);
}).bind(null, __webpack_require__)).catch(__webpack_require__.oe);
Promise.all(/*! require.ensure */[__webpack_require__.e(21), __webpack_require__.e(780)]).then((function(require) {
Promise.all(/*! require.ensure */[__webpack_require__.e(996), __webpack_require__.e(785)]).then((function(require) {
__webpack_require__(/*! ./g */ 7);
}).bind(null, __webpack_require__)).catch(__webpack_require__.oe);
}).bind(null, __webpack_require__)).catch(__webpack_require__.oe);
@ -144,8 +142,7 @@ Promise.all(/*! require.ensure */[__webpack_require__.e(162), __webpack_require_
/******/
/******/ /* webpack/runtime/get javascript chunk filename */
/******/ !function() {
/******/
/******/ // This function only allows to reference on-demand chunks
/******/ // This function allow to reference async chunks
/******/ __webpack_require__.u = function(chunkId) {
/******/ // return url for filenames based on template
/******/ return "" + chunkId + ".output.js";
@ -160,7 +157,7 @@ Promise.all(/*! require.ensure */[__webpack_require__.e(162), __webpack_require_
/******/ // undefined = chunk not loaded, null = chunk preloaded/prefetched
/******/ // Promise = chunk loading, 0 = chunk loaded
/******/ var installedChunks = {
/******/ 404: 0
/******/ 179: 0
/******/ };
/******/
/******/
@ -279,128 +276,128 @@ Promise.all(/*! require.ensure */[__webpack_require__.e(162), __webpack_require_
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
153.output.js 311 bytes {153} [emitted]
162.output.js 317 bytes {162} [emitted]
21.output.js 310 bytes {21} [emitted]
601.output.js 311 bytes {601} [emitted]
780.output.js 311 bytes {780} [emitted]
85.output.js 310 bytes {85} [emitted]
911.output.js 311 bytes {911} [emitted]
output.js 8.55 KiB {404} [emitted] main
390.output.js 311 bytes {390} [emitted]
460.output.js 311 bytes {460} [emitted]
568.output.js 311 bytes {568} [emitted]
767.output.js 311 bytes {767} [emitted]
785.output.js 311 bytes {785} [emitted]
847.output.js 317 bytes {847} [emitted]
996.output.js 311 bytes {996} [emitted]
output.js 8.54 KiB {179} [emitted] main
Entrypoint main = output.js
chunk {21} 21.output.js 21 bytes [rendered] split chunk (cache group: default)
> [0] ./example.js 10:1-12:3
> [0] ./example.js 13:1-15:3
chunk {179} output.js (main) 346 bytes (javascript) 3.64 KiB (runtime) [entry] [rendered]
> ./example.js main
[0] ./example.js 346 bytes {179} [built]
[used exports unknown]
entry ./example.js main
+ 4 hidden chunk modules
chunk {390} 390.output.js 21 bytes [rendered]
> [0] ./example.js 8:0-16:2
[5] ./e.js 21 bytes {390} [built]
[used exports unknown]
require.ensure item ./e [0] ./example.js 8:0-16:2
chunk {460} 460.output.js 21 bytes [rendered]
> ./a ./b ./c [0] ./example.js 1:0-52
> [0] ./example.js 3:0-6:2
[2] ./b.js 21 bytes {21} [built]
[3] ./c.js 21 bytes {460} [built]
[used exports unknown]
amd require ./b [0] ./example.js 1:0-52
cjs require ./b [0] ./example.js 4:1-15
require.ensure item ./b [0] ./example.js 10:1-12:3
require.ensure item ./b [0] ./example.js 13:1-15:3
chunk {85} 85.output.js 21 bytes [rendered]
> [0] ./example.js 3:0-6:2
[4] ./d.js 21 bytes {85} [built]
[used exports unknown]
cjs require ./d [0] ./example.js 5:1-15
chunk {153} 153.output.js 21 bytes [rendered]
amd require ./c [0] ./example.js 1:0-52
chunk {568} 568.output.js 21 bytes [rendered]
> [0] ./example.js 10:1-12:3
[6] ./f.js 21 bytes {153} [built]
[6] ./f.js 21 bytes {568} [built]
[used exports unknown]
cjs require ./f [0] ./example.js 11:2-16
chunk {162} 162.output.js 21 bytes [rendered] split chunk (cache group: default)
chunk {767} 767.output.js 21 bytes [rendered]
> [0] ./example.js 3:0-6:2
[4] ./d.js 21 bytes {767} [built]
[used exports unknown]
cjs require ./d [0] ./example.js 5:1-15
chunk {785} 785.output.js 21 bytes [rendered]
> [0] ./example.js 13:1-15:3
[7] ./g.js 21 bytes {785} [built]
[used exports unknown]
cjs require ./g [0] ./example.js 14:2-16
chunk {847} 847.output.js 21 bytes [rendered] split chunk (cache group: default)
> ./a ./b ./c [0] ./example.js 1:0-52
> [0] ./example.js 3:0-6:2
> [0] ./example.js 8:0-16:2
[1] ./a.js 21 bytes {162} [built]
[1] ./a.js 21 bytes {847} [built]
[used exports unknown]
amd require ./a [0] ./example.js 1:0-52
require.ensure item ./a [0] ./example.js 3:0-6:2
require.ensure item ./a [0] ./example.js 8:0-16:2
cjs require ./a [0] ./example.js 9:1-15
chunk {404} output.js (main) 346 bytes (javascript) 3.65 KiB (runtime) [entry] [rendered]
> ./example.js main
[0] ./example.js 346 bytes {404} [built]
[used exports unknown]
entry ./example.js main
+ 4 hidden chunk modules
chunk {601} 601.output.js 21 bytes [rendered]
> [0] ./example.js 8:0-16:2
[5] ./e.js 21 bytes {601} [built]
[used exports unknown]
require.ensure item ./e [0] ./example.js 8:0-16:2
chunk {780} 780.output.js 21 bytes [rendered]
chunk {996} 996.output.js 21 bytes [rendered] split chunk (cache group: default)
> [0] ./example.js 10:1-12:3
> [0] ./example.js 13:1-15:3
[7] ./g.js 21 bytes {780} [built]
[used exports unknown]
cjs require ./g [0] ./example.js 14:2-16
chunk {911} 911.output.js 21 bytes [rendered]
> ./a ./b ./c [0] ./example.js 1:0-52
[3] ./c.js 21 bytes {911} [built]
> [0] ./example.js 3:0-6:2
[2] ./b.js 21 bytes {996} [built]
[used exports unknown]
amd require ./c [0] ./example.js 1:0-52
amd require ./b [0] ./example.js 1:0-52
cjs require ./b [0] ./example.js 4:1-15
require.ensure item ./b [0] ./example.js 10:1-12:3
require.ensure item ./b [0] ./example.js 13:1-15:3
```
## Production mode
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
153.output.js 93 bytes {153} [emitted]
162.output.js 93 bytes {162} [emitted]
21.output.js 91 bytes {21} [emitted]
601.output.js 93 bytes {601} [emitted]
780.output.js 93 bytes {780} [emitted]
85.output.js 91 bytes {85} [emitted]
911.output.js 93 bytes {911} [emitted]
output.js 1.8 KiB {404} [emitted] main
390.output.js 93 bytes {390} [emitted]
460.output.js 93 bytes {460} [emitted]
568.output.js 93 bytes {568} [emitted]
767.output.js 93 bytes {767} [emitted]
785.output.js 93 bytes {785} [emitted]
847.output.js 93 bytes {847} [emitted]
996.output.js 93 bytes {996} [emitted]
output.js 1.81 KiB {179} [emitted] main
Entrypoint main = output.js
chunk {21} 21.output.js 21 bytes [rendered] split chunk (cache group: default)
> [275] ./example.js 10:1-12:3
> [275] ./example.js 13:1-15:3
> ./a ./b ./c [275] ./example.js 1:0-52
> [275] ./example.js 3:0-6:2
[21] ./b.js 21 bytes {21} [built]
amd require ./b [275] ./example.js 1:0-52
cjs require ./b [275] ./example.js 4:1-15
require.ensure item ./b [275] ./example.js 10:1-12:3
require.ensure item ./b [275] ./example.js 13:1-15:3
chunk {85} 85.output.js 21 bytes [rendered]
> [275] ./example.js 3:0-6:2
[85] ./d.js 21 bytes {85} [built]
cjs require ./d [275] ./example.js 5:1-15
chunk {153} 153.output.js 21 bytes [rendered]
> [275] ./example.js 10:1-12:3
[153] ./f.js 21 bytes {153} [built]
cjs require ./f [275] ./example.js 11:2-16
chunk {162} 162.output.js 21 bytes [rendered] split chunk (cache group: default)
> ./a ./b ./c [275] ./example.js 1:0-52
> [275] ./example.js 3:0-6:2
> [275] ./example.js 8:0-16:2
[162] ./a.js 21 bytes {162} [built]
amd require ./a [275] ./example.js 1:0-52
require.ensure item ./a [275] ./example.js 3:0-6:2
require.ensure item ./a [275] ./example.js 8:0-16:2
cjs require ./a [275] ./example.js 9:1-15
chunk {404} output.js (main) 346 bytes (javascript) 3.65 KiB (runtime) [entry] [rendered]
chunk {179} output.js (main) 346 bytes (javascript) 3.64 KiB (runtime) [entry] [rendered]
> ./example.js main
[275] ./example.js 346 bytes {404} [built]
[144] ./example.js 346 bytes {179} [built]
entry ./example.js main
+ 4 hidden chunk modules
chunk {601} 601.output.js 21 bytes [rendered]
> [275] ./example.js 8:0-16:2
[601] ./e.js 21 bytes {601} [built]
require.ensure item ./e [275] ./example.js 8:0-16:2
chunk {780} 780.output.js 21 bytes [rendered]
> [275] ./example.js 13:1-15:3
[780] ./g.js 21 bytes {780} [built]
cjs require ./g [275] ./example.js 14:2-16
chunk {911} 911.output.js 21 bytes [rendered]
> ./a ./b ./c [275] ./example.js 1:0-52
[911] ./c.js 21 bytes {911} [built]
amd require ./c [275] ./example.js 1:0-52
chunk {390} 390.output.js 21 bytes [rendered]
> [144] ./example.js 8:0-16:2
[390] ./e.js 21 bytes {390} [built]
require.ensure item ./e [144] ./example.js 8:0-16:2
chunk {460} 460.output.js 21 bytes [rendered]
> ./a ./b ./c [144] ./example.js 1:0-52
[460] ./c.js 21 bytes {460} [built]
amd require ./c [144] ./example.js 1:0-52
chunk {568} 568.output.js 21 bytes [rendered]
> [144] ./example.js 10:1-12:3
[568] ./f.js 21 bytes {568} [built]
cjs require ./f [144] ./example.js 11:2-16
chunk {767} 767.output.js 21 bytes [rendered]
> [144] ./example.js 3:0-6:2
[767] ./d.js 21 bytes {767} [built]
cjs require ./d [144] ./example.js 5:1-15
chunk {785} 785.output.js 21 bytes [rendered]
> [144] ./example.js 13:1-15:3
[785] ./g.js 21 bytes {785} [built]
cjs require ./g [144] ./example.js 14:2-16
chunk {847} 847.output.js 21 bytes [rendered] split chunk (cache group: default)
> ./a ./b ./c [144] ./example.js 1:0-52
> [144] ./example.js 3:0-6:2
> [144] ./example.js 8:0-16:2
[847] ./a.js 21 bytes {847} [built]
amd require ./a [144] ./example.js 1:0-52
require.ensure item ./a [144] ./example.js 3:0-6:2
require.ensure item ./a [144] ./example.js 8:0-16:2
cjs require ./a [144] ./example.js 9:1-15
chunk {996} 996.output.js 21 bytes [rendered] split chunk (cache group: default)
> [144] ./example.js 10:1-12:3
> [144] ./example.js 13:1-15:3
> ./a ./b ./c [144] ./example.js 1:0-52
> [144] ./example.js 3:0-6:2
[996] ./b.js 21 bytes {996} [built]
amd require ./b [144] ./example.js 1:0-52
cjs require ./b [144] ./example.js 4:1-15
require.ensure item ./b [144] ./example.js 10:1-12:3
require.ensure item ./b [144] ./example.js 13:1-15:3
```

View File

@ -1,21 +1,19 @@
# example.js
``` javascript
{{example.js}}
```javascript
_{{example.js}}_
```
# webpack.config.js
``` javascript
{{webpack.config.js}}
```javascript
_{{webpack.config.js}}_
```
# dist/output.js
``` javascript
{{dist/output.js}}
```javascript
_{{dist/output.js}}_
```
# Info
@ -23,11 +21,11 @@
## Unoptimized
```
{{stdout}}
_{{stdout}}_
```
## Production mode
```
{{production:stdout}}
_{{production:stdout}}_
```

View File

@ -2,39 +2,38 @@ This example shows automatically created async commons chunks.
The example entry references two chunks:
* entry chunk
* async require -> chunk X
* async require -> chunk Y
* chunk X
* module `a`
* module `b`
* module `c`
* chunk Y
* module `a`
* module `b`
* module `d`
- entry chunk
- async require -> chunk X
- async require -> chunk Y
- chunk X
- module `a`
- module `b`
- module `c`
- chunk Y
- module `a`
- module `b`
- module `d`
These chunks share modules `a` and `b`. The optimization extract these into chunk Z:
Note: Actually the optimization compare size of chunk Z to some minimum value, but this is disabled from this example. In practice there is no configuration needed for this.
* entry chunk
* async require -> chunk X & Z
* async require -> chunk Y & Z
* chunk X
* module `c`
* chunk Y
* module `d`
* chunk Z
* module `a`
* module `b`
- entry chunk
- async require -> chunk X & Z
- async require -> chunk Y & Z
- chunk X
- module `c`
- chunk Y
- module `d`
- chunk Z
- module `a`
- module `b`
Pretty useful for a router in a SPA.
# example.js
``` javascript
```javascript
// a chunks with a, b, c
require(["./a", "./b", "./c"]);
@ -49,7 +48,7 @@ require.ensure(["./a"], function(require) {
<details><summary><code>/******/ (function(modules) { /* webpackBootstrap */ })</code></summary>
``` javascript
```javascript
/******/ (function(modules, runtime) { // webpackBootstrap
/******/ "use strict";
/******/ // The module cache
@ -99,7 +98,7 @@ require.ensure(["./a"], function(require) {
</details>
``` javascript
```javascript
/******/ ([
/* 0 */
/*!********************!*\
@ -110,10 +109,10 @@ require.ensure(["./a"], function(require) {
/***/ (function(__unusedmodule, __unusedexports, __webpack_require__) {
// a chunks with a, b, c
Promise.all(/*! AMD require */[__webpack_require__.e(324), __webpack_require__.e(911)]).then(function() {[__webpack_require__(/*! ./a */ 1), __webpack_require__(/*! ./b */ 2), __webpack_require__(/*! ./c */ 3)];}).catch(__webpack_require__.oe);
Promise.all(/*! AMD require */[__webpack_require__.e(394), __webpack_require__.e(460)]).then(function() {[__webpack_require__(/*! ./a */ 1), __webpack_require__(/*! ./b */ 2), __webpack_require__(/*! ./c */ 3)];}).catch(__webpack_require__.oe);
// a chunk with a, b, d
Promise.all(/*! require.ensure */[__webpack_require__.e(324), __webpack_require__.e(85)]).then((function(require) {
Promise.all(/*! require.ensure */[__webpack_require__.e(394), __webpack_require__.e(767)]).then((function(require) {
__webpack_require__(/*! ./b */ 2);
__webpack_require__(/*! ./d */ 4);
}).bind(null, __webpack_require__)).catch(__webpack_require__.oe);
@ -146,8 +145,7 @@ Promise.all(/*! require.ensure */[__webpack_require__.e(324), __webpack_require_
/******/
/******/ /* webpack/runtime/get javascript chunk filename */
/******/ !function() {
/******/
/******/ // This function only allows to reference on-demand chunks
/******/ // This function allow to reference async chunks
/******/ __webpack_require__.u = function(chunkId) {
/******/ // return url for filenames based on template
/******/ return "" + chunkId + ".output.js";
@ -162,7 +160,7 @@ Promise.all(/*! require.ensure */[__webpack_require__.e(324), __webpack_require_
/******/ // undefined = chunk not loaded, null = chunk preloaded/prefetched
/******/ // Promise = chunk loading, 0 = chunk loaded
/******/ var installedChunks = {
/******/ 404: 0
/******/ 179: 0
/******/ };
/******/
/******/
@ -275,30 +273,10 @@ Promise.all(/*! require.ensure */[__webpack_require__.e(324), __webpack_require_
</details>
# dist/85.output.js
# dist/394.output.js
``` javascript
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[85],{
/***/ 4:
/*!**************!*\
!*** ./d.js ***!
\**************/
/*! other exports [maybe provided (runtime-defined)] [no usage info] */
/*! runtime requirements: module */
/***/ (function(module) {
module.exports = "d";
/***/ })
}]);
```
# dist/324.output.js
``` javascript
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[324],[
```javascript
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[394],[
/* 0 */,
/* 1 */
/*!**************!*\
@ -325,10 +303,10 @@ module.exports = "b";
]]);
```
# dist/911.output.js
# dist/460.output.js
``` javascript
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[911],{
```javascript
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[460],{
/***/ 3:
/*!**************!*\
@ -345,79 +323,99 @@ module.exports = "c";
}]);
```
# dist/767.output.js
```javascript
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[767],{
/***/ 4:
/*!**************!*\
!*** ./d.js ***!
\**************/
/*! other exports [maybe provided (runtime-defined)] [no usage info] */
/*! runtime requirements: module */
/***/ (function(module) {
module.exports = "d";
/***/ })
}]);
```
# Info
## Unoptimized
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
324.output.js 552 bytes {324} [emitted]
85.output.js 310 bytes {85} [emitted]
911.output.js 311 bytes {911} [emitted]
output.js 7.8 KiB {404} [emitted] main
394.output.js 552 bytes {394} [emitted]
460.output.js 311 bytes {460} [emitted]
767.output.js 311 bytes {767} [emitted]
output.js 7.78 KiB {179} [emitted] main
Entrypoint main = output.js
chunk {85} 85.output.js 21 bytes [rendered]
> [0] ./example.js 5:0-8:2
[4] ./d.js 21 bytes {85} [built]
[used exports unknown]
cjs require ./d [0] ./example.js 7:1-15
chunk {324} 324.output.js 42 bytes [rendered] split chunk (cache group: default)
> ./a ./b ./c [0] ./example.js 2:0-30
> [0] ./example.js 5:0-8:2
[1] ./a.js 21 bytes {324} [built]
[used exports unknown]
amd require ./a [0] ./example.js 2:0-30
require.ensure item ./a [0] ./example.js 5:0-8:2
[2] ./b.js 21 bytes {324} [built]
[used exports unknown]
amd require ./b [0] ./example.js 2:0-30
cjs require ./b [0] ./example.js 6:1-15
chunk {404} output.js (main) 164 bytes (javascript) 3.65 KiB (runtime) [entry] [rendered]
chunk {179} output.js (main) 164 bytes (javascript) 3.64 KiB (runtime) [entry] [rendered]
> ./example.js main
[0] ./example.js 164 bytes {404} [built]
[0] ./example.js 164 bytes {179} [built]
[used exports unknown]
entry ./example.js main
+ 4 hidden chunk modules
chunk {911} 911.output.js 21 bytes [rendered]
chunk {394} 394.output.js 42 bytes [rendered] split chunk (cache group: default)
> ./a ./b ./c [0] ./example.js 2:0-30
[3] ./c.js 21 bytes {911} [built]
> [0] ./example.js 5:0-8:2
[1] ./a.js 21 bytes {394} [built]
[used exports unknown]
amd require ./a [0] ./example.js 2:0-30
require.ensure item ./a [0] ./example.js 5:0-8:2
[2] ./b.js 21 bytes {394} [built]
[used exports unknown]
amd require ./b [0] ./example.js 2:0-30
cjs require ./b [0] ./example.js 6:1-15
chunk {460} 460.output.js 21 bytes [rendered]
> ./a ./b ./c [0] ./example.js 2:0-30
[3] ./c.js 21 bytes {460} [built]
[used exports unknown]
amd require ./c [0] ./example.js 2:0-30
chunk {767} 767.output.js 21 bytes [rendered]
> [0] ./example.js 5:0-8:2
[4] ./d.js 21 bytes {767} [built]
[used exports unknown]
cjs require ./d [0] ./example.js 7:1-15
```
## Production mode
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
324.output.js 123 bytes {324} [emitted]
85.output.js 91 bytes {85} [emitted]
911.output.js 93 bytes {911} [emitted]
output.js 1.5 KiB {404} [emitted] main
394.output.js 124 bytes {394} [emitted]
460.output.js 93 bytes {460} [emitted]
767.output.js 93 bytes {767} [emitted]
output.js 1.51 KiB {179} [emitted] main
Entrypoint main = output.js
chunk {85} 85.output.js 21 bytes [rendered]
> [275] ./example.js 5:0-8:2
[85] ./d.js 21 bytes {85} [built]
cjs require ./d [275] ./example.js 7:1-15
chunk {324} 324.output.js 42 bytes [rendered] split chunk (cache group: default)
> ./a ./b ./c [275] ./example.js 2:0-30
> [275] ./example.js 5:0-8:2
[21] ./b.js 21 bytes {324} [built]
amd require ./b [275] ./example.js 2:0-30
cjs require ./b [275] ./example.js 6:1-15
[162] ./a.js 21 bytes {324} [built]
amd require ./a [275] ./example.js 2:0-30
require.ensure item ./a [275] ./example.js 5:0-8:2
chunk {404} output.js (main) 164 bytes (javascript) 3.65 KiB (runtime) [entry] [rendered]
chunk {179} output.js (main) 164 bytes (javascript) 3.64 KiB (runtime) [entry] [rendered]
> ./example.js main
[275] ./example.js 164 bytes {404} [built]
[144] ./example.js 164 bytes {179} [built]
entry ./example.js main
+ 4 hidden chunk modules
chunk {911} 911.output.js 21 bytes [rendered]
> ./a ./b ./c [275] ./example.js 2:0-30
[911] ./c.js 21 bytes {911} [built]
amd require ./c [275] ./example.js 2:0-30
chunk {394} 394.output.js 42 bytes [rendered] split chunk (cache group: default)
> ./a ./b ./c [144] ./example.js 2:0-30
> [144] ./example.js 5:0-8:2
[847] ./a.js 21 bytes {394} [built]
amd require ./a [144] ./example.js 2:0-30
require.ensure item ./a [144] ./example.js 5:0-8:2
[996] ./b.js 21 bytes {394} [built]
amd require ./b [144] ./example.js 2:0-30
cjs require ./b [144] ./example.js 6:1-15
chunk {460} 460.output.js 21 bytes [rendered]
> ./a ./b ./c [144] ./example.js 2:0-30
[460] ./c.js 21 bytes {460} [built]
amd require ./c [144] ./example.js 2:0-30
chunk {767} 767.output.js 21 bytes [rendered]
> [144] ./example.js 5:0-8:2
[767] ./d.js 21 bytes {767} [built]
cjs require ./d [144] ./example.js 7:1-15
```

View File

@ -2,64 +2,63 @@ This example shows automatically created async commons chunks.
The example entry references two chunks:
* entry chunk
* async require -> chunk X
* async require -> chunk Y
* chunk X
* module `a`
* module `b`
* module `c`
* chunk Y
* module `a`
* module `b`
* module `d`
- entry chunk
- async require -> chunk X
- async require -> chunk Y
- chunk X
- module `a`
- module `b`
- module `c`
- chunk Y
- module `a`
- module `b`
- module `d`
These chunks share modules `a` and `b`. The optimization extract these into chunk Z:
Note: Actually the optimization compare size of chunk Z to some minimum value, but this is disabled from this example. In practice there is no configuration needed for this.
* entry chunk
* async require -> chunk X & Z
* async require -> chunk Y & Z
* chunk X
* module `c`
* chunk Y
* module `d`
* chunk Z
* module `a`
* module `b`
- entry chunk
- async require -> chunk X & Z
- async require -> chunk Y & Z
- chunk X
- module `c`
- chunk Y
- module `d`
- chunk Z
- module `a`
- module `b`
Pretty useful for a router in a SPA.
# example.js
``` javascript
{{example.js}}
```javascript
_{{example.js}}_
```
# dist/output.js
``` javascript
{{dist/output.js}}
```javascript
_{{dist/output.js}}_
```
# dist/85.output.js
# dist/394.output.js
``` javascript
{{dist/85.output.js}}
```javascript
_{{dist/394.output.js}}_
```
# dist/324.output.js
# dist/460.output.js
``` javascript
{{dist/324.output.js}}
```javascript
_{{dist/460.output.js}}_
```
# dist/911.output.js
# dist/767.output.js
``` javascript
{{dist/911.output.js}}
```javascript
_{{dist/767.output.js}}_
```
# Info
@ -67,11 +66,11 @@ Pretty useful for a router in a SPA.
## Unoptimized
```
{{stdout}}
_{{stdout}}_
```
## Production mode
```
{{production:stdout}}
_{{production:stdout}}_
```

View File

@ -1,7 +1,6 @@
# example.js
``` javascript
```javascript
// harmony module
// import from CommonJs module
@ -22,7 +21,7 @@ import "./example2";
# fs.js
``` javascript
```javascript
// an example CommonJs module
// content is omitted for brevity
exports.readFile = function() {};
@ -34,7 +33,7 @@ exports.readFile = function() {};
# reexport-commonjs.js
``` javascript
```javascript
// reexport a CommonJs module
export * from "./fs";
// Note that the default export doesn't reexport via export *
@ -46,7 +45,7 @@ export * from "./fs";
# example2.js
``` javascript
```javascript
// CommonJs module
// require a harmony module
@ -58,7 +57,7 @@ var namedExport = module.named;
# harmony.js
``` javascript
```javascript
// just some exports
export default "default";
export var named = "named";
@ -68,7 +67,7 @@ export var named = "named";
<details><summary><code>/******/ (function(modules) { /* webpackBootstrap */ })</code></summary>
``` javascript
```javascript
/******/ (function(modules, runtime) { // webpackBootstrap
/******/ "use strict";
/******/ // The module cache
@ -116,7 +115,7 @@ export var named = "named";
</details>
``` javascript
```javascript
/******/ ([
/* 0 */
/*!********************!*\
@ -289,7 +288,7 @@ var named = "named";
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
output.js 7.6 KiB {0} [emitted] main
Entrypoint main = output.js
@ -327,34 +326,34 @@ chunk {0} output.js (main) 1.13 KiB (javascript) 888 bytes (runtime) [entry] [re
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
output.js 1.11 KiB {404} [emitted] main
output.js 1.11 KiB {179} [emitted] main
Entrypoint main = output.js
chunk {404} output.js (main) 1.13 KiB (javascript) 888 bytes (runtime) [entry] [rendered]
chunk {179} output.js (main) 1.13 KiB (javascript) 888 bytes (runtime) [entry] [rendered]
> ./example.js main
[118] ./example2.js 152 bytes {404} [built]
[no exports used]
harmony side effect evaluation ./example2 [275] ./example.js 16:0-20
[212] ./reexport-commonjs.js 301 bytes {404} [built]
[only some exports used: readFile]
harmony side effect evaluation ./reexport-commonjs [275] ./example.js 12:0-60
harmony import specifier ./reexport-commonjs [275] ./example.js 13:0-9
[275] ./example.js 373 bytes {404} [built]
[144] ./example.js 373 bytes {179} [built]
[no exports]
entry ./example.js main
[325] ./harmony.js 75 bytes {404} [built]
[182] ./reexport-commonjs.js 301 bytes {179} [built]
[only some exports used: readFile]
harmony side effect evaluation ./reexport-commonjs [144] ./example.js 12:0-60
harmony import specifier ./reexport-commonjs [144] ./example.js 13:0-9
[356] ./harmony.js 75 bytes {179} [built]
[exports: default, named]
cjs require ./harmony [118] ./example2.js 4:13-33
[656] ./fs.js 257 bytes {404} [built]
cjs require ./harmony [760] ./example2.js 4:13-33
[760] ./example2.js 152 bytes {179} [built]
[no exports used]
harmony side effect evaluation ./example2 [144] ./example.js 16:0-20
[879] ./fs.js 257 bytes {179} [built]
[only some exports used: default, readFile]
harmony side effect evaluation ./fs [212] ./reexport-commonjs.js 2:0-21
harmony export imported specifier ./fs [212] ./reexport-commonjs.js 2:0-21
harmony side effect evaluation ./fs [275] ./example.js 4:0-22
harmony side effect evaluation ./fs [275] ./example.js 5:0-32
harmony side effect evaluation ./fs [275] ./example.js 6:0-28
harmony import specifier ./fs [275] ./example.js 7:0-2
harmony import specifier ./fs [275] ./example.js 8:0-8
harmony import specifier ./fs [275] ./example.js 9:0-12
harmony side effect evaluation ./fs [144] ./example.js 4:0-22
harmony side effect evaluation ./fs [144] ./example.js 5:0-32
harmony side effect evaluation ./fs [144] ./example.js 6:0-28
harmony import specifier ./fs [144] ./example.js 7:0-2
harmony import specifier ./fs [144] ./example.js 8:0-8
harmony import specifier ./fs [144] ./example.js 9:0-12
harmony side effect evaluation ./fs [182] ./reexport-commonjs.js 2:0-21
harmony export imported specifier ./fs [182] ./reexport-commonjs.js 2:0-21
+ 3 hidden chunk modules
```
```

View File

@ -1,38 +1,37 @@
# example.js
``` javascript
{{example.js}}
```javascript
_{{example.js}}_
```
# fs.js
``` javascript
{{fs.js}}
```javascript
_{{fs.js}}_
```
# reexport-commonjs.js
``` javascript
{{reexport-commonjs.js}}
```javascript
_{{reexport-commonjs.js}}_
```
# example2.js
``` javascript
{{example2.js}}
```javascript
_{{example2.js}}_
```
# harmony.js
``` javascript
{{harmony.js}}
```javascript
_{{harmony.js}}_
```
# dist/output.js
``` javascript
{{dist/output.js}}
```javascript
_{{dist/output.js}}_
```
# Info
@ -40,11 +39,11 @@
## Unoptimized
```
{{stdout}}
_{{stdout}}_
```
## Production mode
```
{{production:stdout}}
```
_{{production:stdout}}_
```

View File

@ -1,6 +1,6 @@
# webpack.config.js
``` javascript
```javascript
var path = require("path");
module.exports = {
// mode: "development || "production",
@ -16,7 +16,7 @@ module.exports = {
# dist/MyLibrary.umd.js
``` javascript
```javascript
(function webpackUniversalModuleDefinition(root, factory) {
if(typeof exports === 'object' && typeof module === 'object')
module.exports = factory();
@ -140,7 +140,7 @@ function increment() {
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
MyLibrary.umd.js 3.73 KiB {0} [emitted] main
Entrypoint main = MyLibrary.umd.js
@ -157,13 +157,13 @@ chunk {0} MyLibrary.umd.js (main) 92 bytes (javascript) 560 bytes (runtime) [ent
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
MyLibrary.umd.js 892 bytes {404} [emitted] main
MyLibrary.umd.js 892 bytes {179} [emitted] main
Entrypoint main = MyLibrary.umd.js
chunk {404} MyLibrary.umd.js (main) 92 bytes (javascript) 560 bytes (runtime) [entry] [rendered]
chunk {179} MyLibrary.umd.js (main) 92 bytes (javascript) 560 bytes (runtime) [entry] [rendered]
> ./example main
[275] ./example.js 92 bytes {404} [built]
[144] ./example.js 92 bytes {179} [built]
[exports: default, increment, value]
entry ./example main
+ 2 hidden chunk modules

View File

@ -1,13 +1,13 @@
# webpack.config.js
``` javascript
{{webpack.config.js}}
```javascript
_{{webpack.config.js}}_
```
# dist/MyLibrary.umd.js
``` javascript
{{dist/MyLibrary.umd.js}}
```javascript
_{{dist/MyLibrary.umd.js}}_
```
# Info
@ -15,11 +15,11 @@
## Unoptimized
```
{{stdout}}
_{{stdout}}_
```
## Production mode
```
{{production:stdout}}
_{{production:stdout}}_
```

View File

@ -1,4 +1,4 @@
This example demonstrates how webpack tracks the using of ES6 imports and exports. Only used exports are emitted to the resulting bundle. The minimizing step then removes the declarations because they are unused.
This example demonstrates how webpack tracks the using of ES6 imports and exports. Only used exports are emitted to the resulting bundle. The minimizing step then removes the declarations because they are unused.
Excluding unused exports from bundles is known as "[tree-shaking](http://www.2ality.com/2015/12/webpack-tree-shaking.html)".
@ -8,7 +8,7 @@ In addition to that, `library.js` simulates an entry point to a big library. `li
# example.js
``` javascript
```javascript
import { add } from './math';
import * as library from "./library";
@ -18,7 +18,7 @@ library.reexportedMultiply(1, 2);
# math.js
``` javascript
```javascript
export function add() {
var sum = 0, i = 0, args = arguments, l = args.length;
while (i < l) {
@ -42,7 +42,7 @@ export function list() {
# library.js
``` javascript
```javascript
export { a, b, c } from "./abc";
export { add as reexportedAdd, multiply as reexportedMultiply } from "./math";
```
@ -51,7 +51,7 @@ export { add as reexportedAdd, multiply as reexportedMultiply } from "./math";
<details><summary><code>/******/ (function(modules) { /* webpackBootstrap */ })</code></summary>
``` javascript
```javascript
/******/ (function(modules, runtime) { // webpackBootstrap
/******/ "use strict";
/******/ // The module cache
@ -99,7 +99,7 @@ export { add as reexportedAdd, multiply as reexportedMultiply } from "./math";
</details>
``` javascript
```javascript
/******/ ([
/* 0 */
/*!********************!*\
@ -247,8 +247,8 @@ function c() { console.log("c"); }
# dist/output.js
``` javascript
!function(t,e){"use strict";var r={};function n(e){if(r[e])return r[e].exports;var o=r[e]={i:e,l:!1,exports:{}};return t[e].call(o.exports,o,o.exports,n),o.l=!0,o.exports}(function(t){t.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},e=Object.prototype.hasOwnProperty,t.d=function(t,r,n){e.call(t,r)||Object.defineProperty(t,r,{enumerable:!0,get:n})};var e})(n),n(275)}({275:function(t,e,r){"use strict";r.r(e);var n=r(702),o=r(472);Object(n.add)(1,2),o.reexportedMultiply(1,2)},472:function(t,e,r){"use strict";r.d(e,"reexportedMultiply",function(){return n.multiply});r(899);var n=r(702)},702:function(t,e,r){"use strict";function n(){for(var t=0,e=0,r=arguments,n=r.length;e<n;)t+=r[e++];return t}function o(){for(var t=1,e=0,r=arguments,n=r.length;e<n;)t*=r[e++];return t}r.d(e,"add",function(){return n}),r.d(e,"multiply",function(){return o})},899:function(){"use strict"}});
```javascript
!function(t,e){"use strict";var r={};function n(e){if(r[e])return r[e].exports;var o=r[e]={i:e,l:!1,exports:{}};return t[e].call(o.exports,o,o.exports,n),o.l=!0,o.exports}(function(t){t.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},e=Object.prototype.hasOwnProperty,t.d=function(t,r,n){e.call(t,r)||Object.defineProperty(t,r,{enumerable:!0,get:n})};var e})(n),n(144)}({144:function(t,e,r){"use strict";r.r(e);var n=r(451),o=r(345);Object(n.k)(1,2),o.h(1,2)},169:function(){"use strict"},345:function(t,e,r){"use strict";r.d(e,"h",function(){return n.j});r(169);var n=r(451)},451:function(t,e,r){"use strict";function n(){for(var t=0,e=0,r=arguments,n=r.length;e<n;)t+=r[e++];return t}function o(){for(var t=1,e=0,r=arguments,n=r.length;e<n;)t*=r[e++];return t}r.d(e,"k",function(){return n}),r.d(e,"j",function(){return o})}});
```
# Info
@ -257,7 +257,7 @@ function c() { console.log("c"); }
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
output.js 7.12 KiB {0} [emitted] main
Entrypoint main = output.js
@ -294,34 +294,34 @@ chunk {0} output.js (main) 698 bytes (javascript) 560 bytes (runtime) [entry] [r
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Asset Size Chunks Chunk Names
output.js 1010 bytes {404} [emitted] main
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
output.js 954 bytes {179} [emitted] main
Entrypoint main = output.js
chunk {404} output.js (main) 698 bytes (javascript) 560 bytes (runtime) [entry] [rendered]
chunk {179} output.js (main) 698 bytes (javascript) 560 bytes (runtime) [entry] [rendered]
> ./example.js main
[275] ./example.js 114 bytes {404} [built]
[144] ./example.js 114 bytes {179} [built]
[no exports]
entry ./example.js main
[472] ./library.js 111 bytes {404} [built]
[exports: a, b, c, reexportedAdd, reexportedMultiply]
[only some exports used: reexportedMultiply]
harmony side effect evaluation ./library [275] ./example.js 2:0-37
harmony import specifier ./library [275] ./example.js 5:0-26
[702] ./math.js 347 bytes {404} [built]
[exports: add, list, multiply]
[only some exports used: add, multiply]
harmony side effect evaluation ./math [275] ./example.js 1:0-29
harmony import specifier ./math [275] ./example.js 4:0-3
harmony side effect evaluation ./math [472] ./library.js 2:0-78
harmony export imported specifier ./math [472] ./library.js 2:0-78
harmony export imported specifier ./math [472] ./library.js 2:0-78
[899] ./abc.js 126 bytes {404} [built]
[169] ./abc.js 126 bytes {179} [built]
[exports: a, b, c]
[no exports used]
harmony side effect evaluation ./abc [472] ./library.js 1:0-32
harmony export imported specifier ./abc [472] ./library.js 1:0-32
harmony export imported specifier ./abc [472] ./library.js 1:0-32
harmony export imported specifier ./abc [472] ./library.js 1:0-32
harmony side effect evaluation ./abc [345] ./library.js 1:0-32
harmony export imported specifier ./abc [345] ./library.js 1:0-32
harmony export imported specifier ./abc [345] ./library.js 1:0-32
harmony export imported specifier ./abc [345] ./library.js 1:0-32
[345] ./library.js 111 bytes {179} [built]
[exports: a, b, c, reexportedAdd, reexportedMultiply]
[only some exports used: reexportedMultiply]
harmony side effect evaluation ./library [144] ./example.js 2:0-37
harmony import specifier ./library [144] ./example.js 5:0-26
[451] ./math.js 347 bytes {179} [built]
[exports: add, list, multiply]
[only some exports used: add, multiply]
harmony side effect evaluation ./math [144] ./example.js 1:0-29
harmony import specifier ./math [144] ./example.js 4:0-3
harmony side effect evaluation ./math [345] ./library.js 2:0-78
harmony export imported specifier ./math [345] ./library.js 2:0-78
harmony export imported specifier ./math [345] ./library.js 2:0-78
+ 2 hidden chunk modules
```

View File

@ -1,4 +1,4 @@
This example demonstrates how webpack tracks the using of ES6 imports and exports. Only used exports are emitted to the resulting bundle. The minimizing step then removes the declarations because they are unused.
This example demonstrates how webpack tracks the using of ES6 imports and exports. Only used exports are emitted to the resulting bundle. The minimizing step then removes the declarations because they are unused.
Excluding unused exports from bundles is known as "[tree-shaking](http://www.2ality.com/2015/12/webpack-tree-shaking.html)".
@ -8,32 +8,32 @@ In addition to that, `library.js` simulates an entry point to a big library. `li
# example.js
``` javascript
{{example.js}}
```javascript
_{{example.js}}_
```
# math.js
``` javascript
{{math.js}}
```javascript
_{{math.js}}_
```
# library.js
``` javascript
{{library.js}}
```javascript
_{{library.js}}_
```
# dist/output.js
``` javascript
{{dist/output.js}}
```javascript
_{{dist/output.js}}_
```
# dist/output.js
``` javascript
{{production:dist/output.js}}
```javascript
_{{production:dist/output.js}}_
```
# Info
@ -41,11 +41,11 @@ In addition to that, `library.js` simulates an entry point to a big library. `li
## Unoptimized
```
{{stdout}}
_{{stdout}}_
```
## Production mode
```
{{production:stdout}}
_{{production:stdout}}_
```

View File

@ -1,7 +1,6 @@
# example.js
``` javascript
```javascript
import { increment as inc } from './increment';
var a = 1;
inc(a); // 2
@ -14,7 +13,7 @@ import("./async-loaded").then(function(asyncLoaded) {
# increment.js
``` javascript
```javascript
import { add } from './math';
export function increment(val) {
return add(val, 1);
@ -25,7 +24,7 @@ export function increment(val) {
<details><summary><code>/******/ (function(modules) { /* webpackBootstrap */ })</code></summary>
``` javascript
```javascript
/******/ (function(modules, runtime) { // webpackBootstrap
/******/ "use strict";
/******/ // The module cache
@ -75,7 +74,7 @@ export function increment(val) {
</details>
``` javascript
```javascript
/******/ ([
/* 0 */
/*!********************!*\
@ -93,7 +92,7 @@ var a = 1;
Object(_increment__WEBPACK_IMPORTED_MODULE_0__["increment"])(a); // 2
// async loading
__webpack_require__.e(/*! import() */ 912).then(__webpack_require__.bind(null, /*! ./async-loaded */ 3)).then(function(asyncLoaded) {
__webpack_require__.e(/*! import() */ 35).then(__webpack_require__.bind(null, /*! ./async-loaded */ 3)).then(function(asyncLoaded) {
console.log(asyncLoaded);
});
@ -189,8 +188,7 @@ function add() {
/******/
/******/ /* webpack/runtime/get javascript chunk filename */
/******/ !function() {
/******/
/******/ // This function only allows to reference on-demand chunks
/******/ // This function allow to reference async chunks
/******/ __webpack_require__.u = function(chunkId) {
/******/ // return url for filenames based on template
/******/ return "" + chunkId + ".output.js";
@ -205,7 +203,7 @@ function add() {
/******/ // undefined = chunk not loaded, null = chunk preloaded/prefetched
/******/ // Promise = chunk loading, 0 = chunk loaded
/******/ var installedChunks = {
/******/ 404: 0
/******/ 179: 0
/******/ };
/******/
/******/
@ -324,54 +322,54 @@ function add() {
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Asset Size Chunks Chunk Names
912.output.js 711 bytes {912} [emitted]
output.js 10.1 KiB {404} [emitted] main
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
35.output.js 710 bytes {35} [emitted]
output.js 10.1 KiB {179} [emitted] main
Entrypoint main = output.js
chunk {404} output.js (main) 400 bytes (javascript) 4.2 KiB (runtime) [entry] [rendered]
chunk {35} 35.output.js 24 bytes [rendered]
> ./async-loaded [0] ./example.js 6:0-24
[3] ./async-loaded.js 24 bytes {35} [built]
[exports: answer]
[used exports unknown]
import() ./async-loaded [0] ./example.js 6:0-24
chunk {179} output.js (main) 400 bytes (javascript) 4.19 KiB (runtime) [entry] [rendered]
> ./example.js main
[0] ./example.js 175 bytes {404} [built]
[0] ./example.js 175 bytes {179} [built]
[no exports]
[used exports unknown]
entry ./example.js main
[1] ./increment.js 90 bytes {404} [built]
[1] ./increment.js 90 bytes {179} [built]
[exports: increment]
[used exports unknown]
harmony side effect evaluation ./increment [0] ./example.js 1:0-47
harmony import specifier ./increment [0] ./example.js 3:0-3
[2] ./math.js 135 bytes {404} [built]
[2] ./math.js 135 bytes {179} [built]
[exports: add]
[used exports unknown]
harmony side effect evaluation ./math [1] ./increment.js 1:0-29
harmony import specifier ./math [1] ./increment.js 3:11-14
+ 6 hidden chunk modules
chunk {912} 912.output.js 24 bytes [rendered]
> ./async-loaded [0] ./example.js 6:0-24
[3] ./async-loaded.js 24 bytes {912} [built]
[exports: answer]
[used exports unknown]
import() ./async-loaded [0] ./example.js 6:0-24
```
## Production mode
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Asset Size Chunks Chunk Names
912.output.js 149 bytes {912} [emitted]
output.js 1.78 KiB {404} [emitted] main
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
35.output.js 147 bytes {35} [emitted]
output.js 1.78 KiB {179} [emitted] main
Entrypoint main = output.js
chunk {404} output.js (main) 400 bytes (javascript) 4.2 KiB (runtime) [entry] [rendered]
chunk {35} 35.output.js 24 bytes [rendered]
> ./async-loaded ./example.js 6:0-24
[35] ./async-loaded.js 24 bytes {35} [built]
[exports: answer]
import() ./async-loaded [973] ./example.js + 2 modules ./example.js 6:0-24
chunk {179} output.js (main) 400 bytes (javascript) 4.19 KiB (runtime) [entry] [rendered]
> ./example.js main
[761] ./example.js + 2 modules 400 bytes {404} [built]
[973] ./example.js + 2 modules 400 bytes {179} [built]
[no exports]
entry ./example.js main
+ 6 hidden chunk modules
chunk {912} 912.output.js 24 bytes [rendered]
> ./async-loaded ./example.js 6:0-24
[912] ./async-loaded.js 24 bytes {912} [built]
[exports: answer]
import() ./async-loaded [761] ./example.js + 2 modules ./example.js 6:0-24
```
```

View File

@ -1,20 +1,19 @@
# example.js
``` javascript
{{example.js}}
```javascript
_{{example.js}}_
```
# increment.js
``` javascript
{{increment.js}}
```javascript
_{{increment.js}}_
```
# dist/output.js
``` javascript
{{dist/output.js}}
```javascript
_{{dist/output.js}}_
```
# Info
@ -22,11 +21,11 @@
## Unoptimized
```
{{stdout}}
_{{stdout}}_
```
## Production mode
```
{{production:stdout}}
```
_{{production:stdout}}_
```

View File

@ -16,7 +16,7 @@ The compression improves with bigger `maxSize`, as gzip works better for bigger
The backward compatibility (non HTTP2 client) improves with bigger `maxSize`, as the number of requests decreases.
``` js
```js
var path = require("path");
var webpack = require("../../");
module.exports = {
@ -47,691 +47,84 @@ module.exports = {
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
0680bac61680c8610c09.js 45.5 KiB {11} [emitted]
0b0f91311462af1b0ecc.js 53.8 KiB {10} [emitted]
10557ccfdd0db2fb15a3.js 37 KiB {4} [emitted]
2dab5ba05b5be9f733ab.js 12.9 KiB {14} [emitted]
490730058c18ec99608d.js 44.5 KiB {1} [emitted]
4e20ab71dd2ab89c7424.js 38.9 KiB {8} [emitted]
5c707b3c1c3c781986d6.js 44 KiB {5} [emitted]
67bec60f58761ac436d3.js 33 KiB {2} [emitted]
9f043abddeffc30b7ba7.js 45.9 KiB {7} [emitted]
a2f0516785c396a526af.js 46.7 KiB {13} [emitted]
adc85b4ae60c62468d75.js 48.6 KiB {9} [emitted]
d1748aa593503ed94146.js 52.8 KiB {3} [emitted]
e2c5bcda096159a0c6e9.js 53.1 KiB {6} [emitted]
e30afcc1290d8bec901e.js 36.4 KiB {0} [emitted]
fb92393be0c0e034b52b.js 42.3 KiB {12} [emitted]
Entrypoint main = 67bec60f58761ac436d3.js 490730058c18ec99608d.js e30afcc1290d8bec901e.js
chunk {0} e30afcc1290d8bec901e.js 28.3 KiB (javascript) 4.93 KiB (runtime) [entry] [rendered]
23b4d3afa4afce5a8976.js 17.8 KiB {0} [emitted] main
cfe118d1dec4334ad964.js 7.14 KiB {1} [emitted]
edecd515756683c83335.js 106 KiB {2} [emitted]
Entrypoint main = 23b4d3afa4afce5a8976.js
chunk {0} 23b4d3afa4afce5a8976.js (main) 8.96 KiB (javascript) 3.89 KiB (runtime) [entry] [rendered]
> ./example main
[0] ./example.js 42 bytes {0} [built]
[1] (webpack)/node_modules/react/react.js 56 bytes {0} [built]
[5] (webpack)/node_modules/react/lib/reactProdInvariant.js 1.08 KiB {0} [built]
[6] (webpack)/node_modules/react/lib/ReactNoopUpdateQueue.js 3.16 KiB {0} [built]
[9] (webpack)/node_modules/react/lib/canDefineProperty.js 539 bytes {0} [built]
[12] (webpack)/node_modules/react/lib/lowPriorityWarning.js 2 KiB {0} [built]
[15] (webpack)/node_modules/react/lib/ReactElement.js 10.9 KiB {0} [built]
[17] (webpack)/node_modules/react/lib/ReactElementSymbol.js 500 bytes {0} [built]
[18] (webpack)/node_modules/react/lib/traverseAllChildren.js 6.75 KiB {0} [built]
[19] (webpack)/node_modules/react/lib/getIteratorFn.js 997 bytes {0} [built]
[22] (webpack)/node_modules/react/lib/ReactPropTypes.js 378 bytes {0} [built]
[27] (webpack)/node_modules/react/lib/ReactVersion.js 228 bytes {0} [built]
[28] (webpack)/node_modules/react/lib/createClass.js 566 bytes {0} [built]
[30] (webpack)/node_modules/react/lib/onlyChild.js 1.19 KiB {0} [built]
+ 4 hidden chunk modules
chunk {1} 490730058c18ec99608d.js 45.7 KiB [initial] [rendered] [recorded] aggressive splitted
> ./example main
[2] (webpack)/node_modules/react/lib/React.js 4.84 KiB {1} [built]
[4] (webpack)/node_modules/react/lib/ReactBaseClasses.js 5.19 KiB {1} [built]
[13] (webpack)/node_modules/react/lib/ReactChildren.js 5.92 KiB {1} [built]
[14] (webpack)/node_modules/react/lib/PooledClass.js 3.16 KiB {1} [built]
[16] (webpack)/node_modules/react/lib/ReactCurrentOwner.js 499 bytes {1} [built]
[20] (webpack)/node_modules/react/lib/KeyEscapeUtils.js 1.14 KiB {1} [built]
[21] (webpack)/node_modules/react/lib/ReactDOMFactories.js 5.23 KiB {1} [built]
[24] (webpack)/node_modules/prop-types/factoryWithTypeCheckers.js 19.4 KiB {1} [built]
[25] (webpack)/node_modules/prop-types/lib/ReactPropTypesSecret.js 314 bytes {1} [built]
chunk {2} 67bec60f58761ac436d3.js 39.3 KiB [initial] [rendered] [recorded] aggressive splitted
> ./example main
[3] (webpack)/node_modules/object-assign/index.js 2.06 KiB {2} [built]
[7] (webpack)/node_modules/fbjs/lib/warning.js 1.85 KiB {2} [built]
[8] (webpack)/node_modules/fbjs/lib/emptyFunction.js 959 bytes {2} [built]
[10] (webpack)/node_modules/fbjs/lib/emptyObject.js 332 bytes {2} [built]
[11] (webpack)/node_modules/fbjs/lib/invariant.js 1.47 KiB {2} [built]
[23] (webpack)/node_modules/prop-types/factory.js 768 bytes {2} [built]
[26] (webpack)/node_modules/prop-types/checkPropTypes.js 2.81 KiB {2} [built]
[29] (webpack)/node_modules/create-react-class/factory.js 29.1 KiB {2} [built]
chunk {3} d1748aa593503ed94146.js 47.4 KiB [rendered] split chunk (cache group: defaultVendors)
[0] ./example.js 42 bytes {0} [built]
[1] (webpack)/node_modules/react/index.js 190 bytes {0} [built]
[2] (webpack)/node_modules/react/cjs/react.production.min.js 6.67 KiB {0} [built]
[3] (webpack)/node_modules/object-assign/index.js 2.06 KiB {0} [built]
+ 5 hidden chunk modules
chunk {1} cfe118d1dec4334ad964.js 6.41 KiB [rendered]
> react-dom [0] ./example.js 2:0-22
[31] (webpack)/node_modules/react-dom/index.js 59 bytes {3} [built]
[38] (webpack)/node_modules/react-dom/lib/ARIADOMPropertyConfig.js 1.65 KiB {3} [built]
[39] (webpack)/node_modules/react-dom/lib/BeforeInputEventPlugin.js 12.8 KiB {3} [built]
[47] (webpack)/node_modules/fbjs/lib/ExecutionEnvironment.js 935 bytes {3} [built]
[83] (webpack)/node_modules/fbjs/lib/createNodesFromMarkup.js 2.48 KiB {3} [built]
[84] (webpack)/node_modules/fbjs/lib/createArrayFromMixed.js 3.89 KiB {3} [built]
[85] (webpack)/node_modules/fbjs/lib/getMarkupWrap.js 2.84 KiB {3} [built]
[88] (webpack)/node_modules/react-dom/lib/AutoFocusUtils.js 477 bytes {3} [built]
[89] (webpack)/node_modules/fbjs/lib/focusNode.js 578 bytes {3} [built]
[90] (webpack)/node_modules/react-dom/lib/CSSPropertyOperations.js 6.91 KiB {3} [built]
[91] (webpack)/node_modules/react-dom/lib/CSSProperty.js 3.61 KiB {3} [built]
[92] (webpack)/node_modules/fbjs/lib/camelizeStyleName.js 875 bytes {3} [built]
[93] (webpack)/node_modules/fbjs/lib/camelize.js 582 bytes {3} [built]
[95] (webpack)/node_modules/fbjs/lib/hyphenateStyleName.js 848 bytes {3} [built]
[96] (webpack)/node_modules/fbjs/lib/hyphenate.js 674 bytes {3} [built]
[97] (webpack)/node_modules/fbjs/lib/memoizeStringOnly.js 572 bytes {3} [built]
[116] (webpack)/node_modules/fbjs/lib/shallowEqual.js 1.58 KiB {3} [built]
[136] (webpack)/node_modules/fbjs/lib/EventListener.js 2.2 KiB {3} [built]
[137] (webpack)/node_modules/fbjs/lib/getUnboundedScrollPosition.js 996 bytes {3} [built]
[143] (webpack)/node_modules/fbjs/lib/containsNode.js 923 bytes {3} [built]
[144] (webpack)/node_modules/fbjs/lib/isTextNode.js 479 bytes {3} [built]
[145] (webpack)/node_modules/fbjs/lib/isNode.js 702 bytes {3} [built]
[146] (webpack)/node_modules/fbjs/lib/getActiveElement.js 912 bytes {3} [built]
chunk {4} 10557ccfdd0db2fb15a3.js 43.3 KiB [rendered] split chunk (cache group: defaultVendors)
[4] (webpack)/node_modules/react-dom/index.js 1.33 KiB {1} [built]
[6] (webpack)/node_modules/scheduler/index.js 198 bytes {1} [built]
[7] (webpack)/node_modules/scheduler/cjs/scheduler.production.min.js 4.88 KiB {1} [built]
chunk {2} edecd515756683c83335.js 106 KiB [rendered] split chunk (cache group: defaultVendors)
> react-dom [0] ./example.js 2:0-22
[32] (webpack)/node_modules/react-dom/lib/ReactDOM.js 4.93 KiB {4} [built]
[36] (webpack)/node_modules/react-dom/lib/ReactDOMComponentFlags.js 307 bytes {4} [built]
[87] (webpack)/node_modules/react-dom/lib/ReactDOMComponent.js 38.1 KiB {4} [built]
chunk {5} 5c707b3c1c3c781986d6.js 44.4 KiB [rendered] split chunk (cache group: defaultVendors)
> react-dom [0] ./example.js 2:0-22
[33] (webpack)/node_modules/react-dom/lib/ReactDOMComponentTree.js 6 KiB {5} [built]
[86] (webpack)/node_modules/react-dom/lib/ReactDOMIDOperations.js 833 bytes {5} [built]
[103] (webpack)/node_modules/react-dom/lib/ReactDOMInput.js 12.7 KiB {5} [built]
[106] (webpack)/node_modules/react-dom/lib/ReactDOMOption.js 3.48 KiB {5} [built]
[107] (webpack)/node_modules/react-dom/lib/ReactDOMSelect.js 6.53 KiB {5} [built]
[131] (webpack)/node_modules/react-dom/lib/ReactDOMEmptyComponent.js 1.74 KiB {5} [built]
[133] (webpack)/node_modules/react-dom/lib/ReactDOMTextComponent.js 5.56 KiB {5} [built]
[141] (webpack)/node_modules/react-dom/lib/ReactDOMSelection.js 6.5 KiB {5} [built]
[161] (webpack)/node_modules/react-dom/lib/ReactDOMContainerInfo.js 845 bytes {5} [built]
[162] (webpack)/node_modules/react-dom/lib/ReactDOMFeatureFlags.js 317 bytes {5} [built]
chunk {6} e2c5bcda096159a0c6e9.js 46.6 KiB [rendered] split chunk (cache group: defaultVendors)
> react-dom [0] ./example.js 2:0-22
[34] (webpack)/node_modules/react-dom/lib/reactProdInvariant.js 1.08 KiB {6} [built]
[46] (webpack)/node_modules/react-dom/lib/forEachAccumulated.js 733 bytes {6} [built]
[50] (webpack)/node_modules/react-dom/lib/getTextContentAccessor.js 833 bytes {6} [built]
[63] (webpack)/node_modules/react-dom/lib/inputValueTracking.js 2.9 KiB {6} [built]
[64] (webpack)/node_modules/react-dom/lib/getEventTarget.js 888 bytes {6} [built]
[65] (webpack)/node_modules/react-dom/lib/isEventSupported.js 1.77 KiB {6} [built]
[66] (webpack)/node_modules/react-dom/lib/isTextInputElement.js 895 bytes {6} [built]
[72] (webpack)/node_modules/react-dom/lib/getEventModifierState.js 1.08 KiB {6} [built]
[78] (webpack)/node_modules/react-dom/lib/setInnerHTML.js 3.65 KiB {6} [built]
[80] (webpack)/node_modules/react-dom/lib/setTextContent.js 1.3 KiB {6} [built]
[81] (webpack)/node_modules/react-dom/lib/escapeTextContentForBrowser.js 3.23 KiB {6} [built]
[99] (webpack)/node_modules/react-dom/lib/quoteAttributeValueForBrowser.js 578 bytes {6} [built]
[102] (webpack)/node_modules/react-dom/lib/getVendorPrefixedEventName.js 2.68 KiB {6} [built]
[113] (webpack)/node_modules/react-dom/lib/instantiateReactComponent.js 4.82 KiB {6} [built]
[117] (webpack)/node_modules/react-dom/lib/shouldUpdateReactComponent.js 1.25 KiB {6} [built]
[122] (webpack)/node_modules/react-dom/lib/traverseAllChildren.js 6.75 KiB {6} [built]
[124] (webpack)/node_modules/react-dom/lib/getIteratorFn.js 997 bytes {6} [built]
[126] (webpack)/node_modules/react-dom/lib/flattenChildren.js 2.59 KiB {6} [built]
[142] (webpack)/node_modules/react-dom/lib/getNodeForCharacterOffset.js 1.46 KiB {6} [built]
[154] (webpack)/node_modules/react-dom/lib/getEventCharCode.js 1.35 KiB {6} [built]
[155] (webpack)/node_modules/react-dom/lib/getEventKey.js 2.68 KiB {6} [built]
[166] (webpack)/node_modules/react-dom/lib/findDOMNode.js 2.29 KiB {6} [built]
[167] (webpack)/node_modules/react-dom/lib/getHostComponentFromComposite.js 618 bytes {6} [built]
[168] (webpack)/node_modules/react-dom/lib/renderSubtreeIntoContainer.js 300 bytes {6} [built]
chunk {7} 9f043abddeffc30b7ba7.js 45.9 KiB [rendered] split chunk (cache group: defaultVendors)
> react-dom [0] ./example.js 2:0-22
[35] (webpack)/node_modules/react-dom/lib/DOMProperty.js 7.93 KiB {7} [built]
[54] (webpack)/node_modules/react-dom/lib/ChangeEventPlugin.js 10.4 KiB {7} [built]
[56] (webpack)/node_modules/react-dom/lib/CallbackQueue.js 2.97 KiB {7} [built]
[67] (webpack)/node_modules/react-dom/lib/DefaultEventPluginOrder.js 955 bytes {7} [built]
[68] (webpack)/node_modules/react-dom/lib/EnterLeaveEventPlugin.js 2.96 KiB {7} [built]
[75] (webpack)/node_modules/react-dom/lib/DOMChildrenOperations.js 7.42 KiB {7} [built]
[76] (webpack)/node_modules/react-dom/lib/DOMLazyTree.js 3.51 KiB {7} [built]
[77] (webpack)/node_modules/react-dom/lib/DOMNamespaces.js 383 bytes {7} [built]
[82] (webpack)/node_modules/react-dom/lib/Danger.js 2.07 KiB {7} [built]
[98] (webpack)/node_modules/react-dom/lib/DOMPropertyOperations.js 7.31 KiB {7} [built]
chunk {8} 4e20ab71dd2ab89c7424.js 34 KiB [rendered] split chunk (cache group: defaultVendors)
> react-dom [0] ./example.js 2:0-22
[37] (webpack)/node_modules/react-dom/lib/ReactDefaultInjection.js 3.3 KiB {8} [built]
[44] (webpack)/node_modules/react-dom/lib/ReactErrorUtils.js 2.04 KiB {8} [built]
[57] (webpack)/node_modules/react-dom/lib/ReactFeatureFlags.js 506 bytes {8} [built]
[61] (webpack)/node_modules/react-dom/lib/ReactInstrumentation.js 479 bytes {8} [built]
[101] (webpack)/node_modules/react-dom/lib/ReactEventEmitterMixin.js 836 bytes {8} [built]
[108] (webpack)/node_modules/react-dom/lib/ReactDOMTextarea.js 6.19 KiB {8} [built]
[111] (webpack)/node_modules/react-dom/lib/ReactInstanceMap.js 1.07 KiB {8} [built]
[118] (webpack)/node_modules/react-dom/lib/ReactEmptyComponent.js 582 bytes {8} [built]
[119] (webpack)/node_modules/react-dom/lib/ReactHostComponent.js 1.81 KiB {8} [built]
[123] (webpack)/node_modules/react-dom/lib/ReactElementSymbol.js 500 bytes {8} [built]
[132] (webpack)/node_modules/react-dom/lib/ReactDOMTreeTraversal.js 3.51 KiB {8} [built]
[134] (webpack)/node_modules/react-dom/lib/ReactDefaultBatchingStrategy.js 1.72 KiB {8} [built]
[135] (webpack)/node_modules/react-dom/lib/ReactEventListener.js 5.05 KiB {8} [built]
[138] (webpack)/node_modules/react-dom/lib/ReactInjection.js 1.05 KiB {8} [built]
[140] (webpack)/node_modules/react-dom/lib/ReactInputSelection.js 4.05 KiB {8} [built]
[163] (webpack)/node_modules/react-dom/lib/ReactMarkupChecksum.js 1.32 KiB {8} [built]
chunk {9} adc85b4ae60c62468d75.js 48.5 KiB [rendered] split chunk (cache group: defaultVendors)
> react-dom [0] ./example.js 2:0-22
[40] (webpack)/node_modules/react-dom/lib/EventPropagators.js 4.86 KiB {9} [built]
[41] (webpack)/node_modules/react-dom/lib/EventPluginHub.js 8.77 KiB {9} [built]
[42] (webpack)/node_modules/react-dom/lib/EventPluginRegistry.js 9.4 KiB {9} [built]
[43] (webpack)/node_modules/react-dom/lib/EventPluginUtils.js 7.64 KiB {9} [built]
[48] (webpack)/node_modules/react-dom/lib/FallbackCompositionState.js 2.25 KiB {9} [built]
[49] (webpack)/node_modules/react-dom/lib/PooledClass.js 3.16 KiB {9} [built]
[73] (webpack)/node_modules/react-dom/lib/HTMLDOMPropertyConfig.js 6.32 KiB {9} [built]
[104] (webpack)/node_modules/react-dom/lib/LinkedValueUtils.js 5 KiB {9} [built]
[121] (webpack)/node_modules/react-dom/lib/KeyEscapeUtils.js 1.14 KiB {9} [built]
chunk {10} 0b0f91311462af1b0ecc.js 48.2 KiB [rendered] split chunk (cache group: defaultVendors)
> react-dom [0] ./example.js 2:0-22
[45] (webpack)/node_modules/react-dom/lib/accumulateInto.js 1.54 KiB {10} [built]
[51] (webpack)/node_modules/react-dom/lib/SyntheticCompositionEvent.js 977 bytes {10} [built]
[52] (webpack)/node_modules/react-dom/lib/SyntheticEvent.js 9.02 KiB {10} [built]
[53] (webpack)/node_modules/react-dom/lib/SyntheticInputEvent.js 967 bytes {10} [built]
[62] (webpack)/node_modules/react-dom/lib/Transaction.js 9.21 KiB {10} [built]
[69] (webpack)/node_modules/react-dom/lib/SyntheticMouseEvent.js 1.97 KiB {10} [built]
[70] (webpack)/node_modules/react-dom/lib/SyntheticUIEvent.js 1.42 KiB {10} [built]
[71] (webpack)/node_modules/react-dom/lib/ViewportMetrics.js 482 bytes {10} [built]
[79] (webpack)/node_modules/react-dom/lib/createMicrosoftUnsafeLocalFunction.js 688 bytes {10} [built]
[94] (webpack)/node_modules/react-dom/lib/dangerousStyleValue.js 2.87 KiB {10} [built]
[149] (webpack)/node_modules/react-dom/lib/SimpleEventPlugin.js 7.67 KiB {10} [built]
[150] (webpack)/node_modules/react-dom/lib/SyntheticAnimationEvent.js 1.06 KiB {10} [built]
[151] (webpack)/node_modules/react-dom/lib/SyntheticClipboardEvent.js 1.02 KiB {10} [built]
[152] (webpack)/node_modules/react-dom/lib/SyntheticFocusEvent.js 944 bytes {10} [built]
[153] (webpack)/node_modules/react-dom/lib/SyntheticKeyboardEvent.js 2.52 KiB {10} [built]
[156] (webpack)/node_modules/react-dom/lib/SyntheticDragEvent.js 949 bytes {10} [built]
[157] (webpack)/node_modules/react-dom/lib/SyntheticTouchEvent.js 1.13 KiB {10} [built]
[158] (webpack)/node_modules/react-dom/lib/SyntheticTransitionEvent.js 1.08 KiB {10} [built]
[159] (webpack)/node_modules/react-dom/lib/SyntheticWheelEvent.js 1.76 KiB {10} [built]
[164] (webpack)/node_modules/react-dom/lib/adler32.js 1.04 KiB {10} [built]
chunk {11} 0680bac61680c8610c09.js 46.2 KiB [rendered] split chunk (cache group: defaultVendors)
> react-dom [0] ./example.js 2:0-22
[55] (webpack)/node_modules/react-dom/lib/ReactUpdates.js 9.12 KiB {11} [built]
[58] (webpack)/node_modules/react-dom/lib/ReactReconciler.js 5.95 KiB {11} [built]
[59] (webpack)/node_modules/react-dom/lib/ReactRef.js 2.38 KiB {11} [built]
[127] (webpack)/node_modules/react-dom/lib/ReactServerRenderingTransaction.js 2.12 KiB {11} [built]
[128] (webpack)/node_modules/react-dom/lib/ReactServerUpdateQueue.js 4.6 KiB {11} [built]
[129] (webpack)/node_modules/react-dom/lib/ReactUpdateQueue.js 9.02 KiB {11} [built]
[147] (webpack)/node_modules/react-dom/lib/SVGDOMPropertyConfig.js 7.03 KiB {11} [built]
[148] (webpack)/node_modules/react-dom/lib/SelectEventPlugin.js 5.8 KiB {11} [built]
[165] (webpack)/node_modules/react-dom/lib/ReactVersion.js 228 bytes {11} [built]
chunk {12} fb92393be0c0e034b52b.js 48.4 KiB [rendered] split chunk (cache group: defaultVendors)
> react-dom [0] ./example.js 2:0-22
[60] (webpack)/node_modules/react-dom/lib/ReactOwner.js 3.33 KiB {12} [built]
[105] (webpack)/node_modules/react-dom/lib/ReactPropTypesSecret.js 320 bytes {12} [built]
[109] (webpack)/node_modules/react-dom/lib/ReactMultiChild.js 14.1 KiB {12} [built]
[115] (webpack)/node_modules/react-dom/lib/ReactNodeTypes.js 894 bytes {12} [built]
[139] (webpack)/node_modules/react-dom/lib/ReactReconcileTransaction.js 5.02 KiB {12} [built]
[160] (webpack)/node_modules/react-dom/lib/ReactMount.js 24.8 KiB {12} [built]
chunk {13} a2f0516785c396a526af.js 54.2 KiB [rendered] split chunk (cache group: defaultVendors)
> react-dom [0] ./example.js 2:0-22
[74] (webpack)/node_modules/react-dom/lib/ReactComponentBrowserEnvironment.js 782 bytes {13} [built]
[100] (webpack)/node_modules/react-dom/lib/ReactBrowserEventEmitter.js 12.1 KiB {13} [built]
[110] (webpack)/node_modules/react-dom/lib/ReactComponentEnvironment.js 1.15 KiB {13} [built]
[112] (webpack)/node_modules/react-dom/lib/ReactChildReconciler.js 5.84 KiB {13} [built]
[114] (webpack)/node_modules/react-dom/lib/ReactCompositeComponent.js 34.3 KiB {13} [built]
chunk {14} 2dab5ba05b5be9f733ab.js 24.9 KiB [rendered] split chunk (cache group: defaultVendors)
> react-dom [0] ./example.js 2:0-22
[120] (webpack)/node_modules/react/lib/getNextDebugID.js 315 bytes {14} [built]
[125] (webpack)/node_modules/react/lib/ReactComponentTreeHook.js 11.4 KiB {14} [built]
[130] (webpack)/node_modules/react-dom/lib/validateDOMNesting.js 13.2 KiB {14} [built]
[5] (webpack)/node_modules/react-dom/cjs/react-dom.production.min.js 106 KiB {2} [built]
```
## Production mode
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
00c2cadeab023458eca4.js 10.6 KiB {719} [emitted]
03f77bf74f67b83d5226.js 7.9 KiB {140} [emitted]
4b5aa931c86715ce82cf.js 9.99 KiB {995} [emitted]
5761522adba639bf9391.js 4.22 KiB {608} [emitted]
885b0a5ea2c5e79a2fd7.js 13.1 KiB {303} [emitted]
9c1d9ca9febd4fc851a1.js 10.5 KiB {525} [emitted]
9ef67c3fb705d45678e9.js 11.1 KiB {396} [emitted]
a033f17ac742bb387b1e.js 10.1 KiB {779} [emitted]
ad6598775774d1aaf570.js 12 KiB {506} [emitted]
b45be753b5b958e18e5b.js 10.2 KiB {996} [emitted]
c391311151f9325bda21.js 8.16 KiB {326} [emitted]
ca007d1b988419797c9c.js 5.89 KiB {169} [emitted]
cb0f8e11ab30bdbfba99.js 6.72 KiB {640} [emitted]
cfef182740ff1e8f8371.js 12.4 KiB {572} [emitted]
ec9378ddc1199cfd9214.js 11.1 KiB {45} [emitted]
Entrypoint main = cb0f8e11ab30bdbfba99.js 9ef67c3fb705d45678e9.js ca007d1b988419797c9c.js
chunk {45} ec9378ddc1199cfd9214.js 47.4 KiB [rendered] [recorded] aggressive splitted
> react-dom [275] ./example.js 2:0-22
[3] (webpack)/node_modules/fbjs/lib/getMarkupWrap.js 2.84 KiB {45} [built]
[8] (webpack)/node_modules/fbjs/lib/createNodesFromMarkup.js 2.48 KiB {45} [built]
[24] (webpack)/node_modules/fbjs/lib/focusNode.js 578 bytes {45} [built]
[70] (webpack)/node_modules/fbjs/lib/getUnboundedScrollPosition.js 996 bytes {45} [built]
[78] (webpack)/node_modules/react-dom/lib/CSSPropertyOperations.js 6.91 KiB {45} [built]
[124] (webpack)/node_modules/react-dom/lib/ARIADOMPropertyConfig.js 1.65 KiB {45} [built]
[151] (webpack)/node_modules/fbjs/lib/getActiveElement.js 912 bytes {45} [built]
[242] (webpack)/node_modules/fbjs/lib/hyphenateStyleName.js 848 bytes {45} [built]
[360] (webpack)/node_modules/react-dom/index.js 59 bytes {45} [built]
[386] (webpack)/node_modules/fbjs/lib/shallowEqual.js 1.58 KiB {45} [built]
[396] (webpack)/node_modules/react-dom/lib/CSSProperty.js 3.61 KiB {45} [built]
[448] (webpack)/node_modules/fbjs/lib/containsNode.js 923 bytes {45} [built]
[574] (webpack)/node_modules/react-dom/lib/AutoFocusUtils.js 477 bytes {45} [built]
[655] (webpack)/node_modules/fbjs/lib/camelize.js 582 bytes {45} [built]
[674] (webpack)/node_modules/react-dom/lib/BeforeInputEventPlugin.js 12.8 KiB {45} [built]
[736] (webpack)/node_modules/fbjs/lib/memoizeStringOnly.js 572 bytes {45} [built]
[738] (webpack)/node_modules/fbjs/lib/ExecutionEnvironment.js 935 bytes {45} [built]
[742] (webpack)/node_modules/fbjs/lib/isNode.js 702 bytes {45} [built]
[773] (webpack)/node_modules/fbjs/lib/createArrayFromMixed.js 3.89 KiB {45} [built]
[776] (webpack)/node_modules/fbjs/lib/EventListener.js 2.2 KiB {45} [built]
[827] (webpack)/node_modules/fbjs/lib/isTextNode.js 479 bytes {45} [built]
[837] (webpack)/node_modules/fbjs/lib/camelizeStyleName.js 875 bytes {45} [built]
[872] (webpack)/node_modules/fbjs/lib/hyphenate.js 674 bytes {45} [built]
chunk {140} 03f77bf74f67b83d5226.js 48.4 KiB [rendered] [recorded] aggressive splitted
> react-dom [275] ./example.js 2:0-22
[74] (webpack)/node_modules/react-dom/lib/ReactNodeTypes.js 894 bytes {140} [built]
[86] (webpack)/node_modules/react-dom/lib/ReactOwner.js 3.33 KiB {140} [built]
[216] (webpack)/node_modules/react-dom/lib/ReactMount.js 24.8 KiB {140} [built]
[302] (webpack)/node_modules/react-dom/lib/ReactPropTypesSecret.js 320 bytes {140} [built]
[709] (webpack)/node_modules/react-dom/lib/ReactReconcileTransaction.js 5.02 KiB {140} [built]
[829] (webpack)/node_modules/react-dom/lib/ReactMultiChild.js 14.1 KiB {140} [built]
chunk {169} ca007d1b988419797c9c.js 28.3 KiB (javascript) 4.95 KiB (runtime) [entry] [rendered]
3cc97a4d236fcb0292f4.js 103 KiB {967} [emitted]
52c0c30d4de980e97b00.js 5.06 KiB {834} [emitted]
9054d0fc8a6609bd4281.js 9.16 KiB {179} [emitted] main
Entrypoint main = 9054d0fc8a6609bd4281.js
chunk {179} 9054d0fc8a6609bd4281.js (main) 8.96 KiB (javascript) 3.9 KiB (runtime) [entry] [rendered]
> ./example main
[18] (webpack)/node_modules/react/lib/canDefineProperty.js 539 bytes {169} [built]
[52] (webpack)/node_modules/react/lib/ReactElement.js 10.9 KiB {169} [built]
[69] (webpack)/node_modules/react/lib/reactProdInvariant.js 1.08 KiB {169} [built]
[71] (webpack)/node_modules/react/lib/ReactNoopUpdateQueue.js 3.16 KiB {169} [built]
[275] ./example.js 42 bytes {169} [built]
[339] (webpack)/node_modules/react/lib/createClass.js 566 bytes {169} [built]
[408] (webpack)/node_modules/react/lib/traverseAllChildren.js 6.75 KiB {169} [built]
[418] (webpack)/node_modules/react/lib/ReactElementSymbol.js 500 bytes {169} [built]
[426] (webpack)/node_modules/react/lib/getIteratorFn.js 997 bytes {169} [built]
[620] (webpack)/node_modules/react/react.js 56 bytes {169} [built]
[716] (webpack)/node_modules/react/lib/onlyChild.js 1.19 KiB {169} [built]
[816] (webpack)/node_modules/react/lib/lowPriorityWarning.js 2 KiB {169} [built]
[895] (webpack)/node_modules/react/lib/ReactPropTypes.js 378 bytes {169} [built]
[920] (webpack)/node_modules/react/lib/ReactVersion.js 228 bytes {169} [built]
+ 4 hidden chunk modules
chunk {303} 885b0a5ea2c5e79a2fd7.js 46.2 KiB [rendered] [recorded] aggressive splitted
> react-dom [275] ./example.js 2:0-22
[199] (webpack)/node_modules/react-dom/lib/ReactRef.js 2.38 KiB {303} [built]
[327] (webpack)/node_modules/react-dom/lib/ReactUpdateQueue.js 9.02 KiB {303} [built]
[381] (webpack)/node_modules/react-dom/lib/ReactUpdates.js 9.12 KiB {303} [built]
[493] (webpack)/node_modules/react-dom/lib/SelectEventPlugin.js 5.8 KiB {303} [built]
[550] (webpack)/node_modules/react-dom/lib/ReactVersion.js 228 bytes {303} [built]
[589] (webpack)/node_modules/react-dom/lib/ReactServerRenderingTransaction.js 2.12 KiB {303} [built]
[661] (webpack)/node_modules/react-dom/lib/ReactReconciler.js 5.95 KiB {303} [built]
[931] (webpack)/node_modules/react-dom/lib/SVGDOMPropertyConfig.js 7.03 KiB {303} [built]
[996] (webpack)/node_modules/react-dom/lib/ReactServerUpdateQueue.js 4.6 KiB {303} [built]
chunk {326} c391311151f9325bda21.js 34 KiB [rendered] [recorded] aggressive splitted
> react-dom [275] ./example.js 2:0-22
[163] (webpack)/node_modules/react-dom/lib/ReactDefaultBatchingStrategy.js 1.72 KiB {326} [built]
[183] (webpack)/node_modules/react-dom/lib/ReactEventListener.js 5.05 KiB {326} [built]
[232] (webpack)/node_modules/react-dom/lib/ReactDefaultInjection.js 3.3 KiB {326} [built]
[240] (webpack)/node_modules/react-dom/lib/ReactEmptyComponent.js 582 bytes {326} [built]
[244] (webpack)/node_modules/react-dom/lib/ReactInjection.js 1.05 KiB {326} [built]
[313] (webpack)/node_modules/react-dom/lib/ReactInstrumentation.js 479 bytes {326} [built]
[333] (webpack)/node_modules/react-dom/lib/ReactMarkupChecksum.js 1.32 KiB {326} [built]
[348] (webpack)/node_modules/react-dom/lib/ReactDOMTreeTraversal.js 3.51 KiB {326} [built]
[527] (webpack)/node_modules/react-dom/lib/ReactFeatureFlags.js 506 bytes {326} [built]
[595] (webpack)/node_modules/react-dom/lib/ReactErrorUtils.js 2.04 KiB {326} [built]
[653] (webpack)/node_modules/react-dom/lib/ReactHostComponent.js 1.81 KiB {326} [built]
[688] (webpack)/node_modules/react-dom/lib/ReactEventEmitterMixin.js 836 bytes {326} [built]
[714] (webpack)/node_modules/react-dom/lib/ReactInstanceMap.js 1.07 KiB {326} [built]
[763] (webpack)/node_modules/react-dom/lib/ReactDOMTextarea.js 6.19 KiB {326} [built]
[842] (webpack)/node_modules/react-dom/lib/ReactElementSymbol.js 500 bytes {326} [built]
[956] (webpack)/node_modules/react-dom/lib/ReactInputSelection.js 4.05 KiB {326} [built]
chunk {396} 9ef67c3fb705d45678e9.js 45.7 KiB [initial] [rendered] [recorded] aggressive splitted
> ./example main
[35] (webpack)/node_modules/react/lib/ReactCurrentOwner.js 499 bytes {396} [built]
[389] (webpack)/node_modules/react/lib/ReactChildren.js 5.92 KiB {396} [built]
[405] (webpack)/node_modules/prop-types/factoryWithTypeCheckers.js 19.4 KiB {396} [built]
[464] (webpack)/node_modules/react/lib/ReactBaseClasses.js 5.19 KiB {396} [built]
[507] (webpack)/node_modules/react/lib/PooledClass.js 3.16 KiB {396} [built]
[518] (webpack)/node_modules/react/lib/ReactDOMFactories.js 5.23 KiB {396} [built]
[526] (webpack)/node_modules/react/lib/React.js 4.84 KiB {396} [built]
[606] (webpack)/node_modules/react/lib/KeyEscapeUtils.js 1.14 KiB {396} [built]
[977] (webpack)/node_modules/prop-types/lib/ReactPropTypesSecret.js 314 bytes {396} [built]
chunk {506} ad6598775774d1aaf570.js 48.5 KiB [rendered] [recorded] aggressive splitted
> react-dom [275] ./example.js 2:0-22
[30] (webpack)/node_modules/react-dom/lib/FallbackCompositionState.js 2.25 KiB {506} [built]
[64] (webpack)/node_modules/react-dom/lib/HTMLDOMPropertyConfig.js 6.32 KiB {506} [built]
[75] (webpack)/node_modules/react-dom/lib/EventPluginRegistry.js 9.4 KiB {506} [built]
[141] (webpack)/node_modules/react-dom/lib/EventPluginUtils.js 7.64 KiB {506} [built]
[226] (webpack)/node_modules/react-dom/lib/EventPropagators.js 4.86 KiB {506} [built]
[730] (webpack)/node_modules/react-dom/lib/KeyEscapeUtils.js 1.14 KiB {506} [built]
[777] (webpack)/node_modules/react-dom/lib/LinkedValueUtils.js 5 KiB {506} [built]
[823] (webpack)/node_modules/react-dom/lib/PooledClass.js 3.16 KiB {506} [built]
[986] (webpack)/node_modules/react-dom/lib/EventPluginHub.js 8.77 KiB {506} [built]
chunk {525} 9c1d9ca9febd4fc851a1.js 43.3 KiB [rendered] [recorded] aggressive splitted
> react-dom [275] ./example.js 2:0-22
[505] (webpack)/node_modules/react-dom/lib/ReactDOMComponent.js 38.1 KiB {525} [built]
[950] (webpack)/node_modules/react-dom/lib/ReactDOM.js 4.93 KiB {525} [built]
[998] (webpack)/node_modules/react-dom/lib/ReactDOMComponentFlags.js 307 bytes {525} [built]
chunk {572} cfef182740ff1e8f8371.js 54.2 KiB [rendered] [recorded] aggressive splitted
> react-dom [275] ./example.js 2:0-22
[106] (webpack)/node_modules/react-dom/lib/ReactBrowserEventEmitter.js 12.1 KiB {572} [built]
[479] (webpack)/node_modules/react-dom/lib/ReactChildReconciler.js 5.84 KiB {572} [built]
[501] (webpack)/node_modules/react-dom/lib/ReactComponentBrowserEnvironment.js 782 bytes {572} [built]
[723] (webpack)/node_modules/react-dom/lib/ReactComponentEnvironment.js 1.15 KiB {572} [built]
[992] (webpack)/node_modules/react-dom/lib/ReactCompositeComponent.js 34.3 KiB {572} [built]
chunk {608} 5761522adba639bf9391.js 24.9 KiB [rendered]
> react-dom [275] ./example.js 2:0-22
[84] (webpack)/node_modules/react/lib/getNextDebugID.js 315 bytes {608} [built]
[238] (webpack)/node_modules/react-dom/lib/validateDOMNesting.js 13.2 KiB {608} [built]
[725] (webpack)/node_modules/react/lib/ReactComponentTreeHook.js 11.4 KiB {608} [built]
chunk {640} cb0f8e11ab30bdbfba99.js 39.3 KiB [initial] [rendered] [recorded] aggressive splitted
> ./example main
[123] (webpack)/node_modules/prop-types/checkPropTypes.js 2.81 KiB {640} [built]
[139] (webpack)/node_modules/prop-types/factory.js 768 bytes {640} [built]
[152] (webpack)/node_modules/fbjs/lib/invariant.js 1.47 KiB {640} [built]
[499] (webpack)/node_modules/object-assign/index.js 2.06 KiB {640} [built]
[514] (webpack)/node_modules/fbjs/lib/warning.js 1.85 KiB {640} [built]
[553] (webpack)/node_modules/create-react-class/factory.js 29.1 KiB {640} [built]
[727] (webpack)/node_modules/fbjs/lib/emptyFunction.js 959 bytes {640} [built]
[789] (webpack)/node_modules/fbjs/lib/emptyObject.js 332 bytes {640} [built]
chunk {719} 00c2cadeab023458eca4.js 45.9 KiB [rendered] [recorded] aggressive splitted
> react-dom [275] ./example.js 2:0-22
[317] (webpack)/node_modules/react-dom/lib/ChangeEventPlugin.js 10.4 KiB {719} [built]
[395] (webpack)/node_modules/react-dom/lib/DOMLazyTree.js 3.51 KiB {719} [built]
[416] (webpack)/node_modules/react-dom/lib/DOMNamespaces.js 383 bytes {719} [built]
[513] (webpack)/node_modules/react-dom/lib/DOMChildrenOperations.js 7.42 KiB {719} [built]
[529] (webpack)/node_modules/react-dom/lib/EnterLeaveEventPlugin.js 2.96 KiB {719} [built]
[619] (webpack)/node_modules/react-dom/lib/DefaultEventPluginOrder.js 955 bytes {719} [built]
[646] (webpack)/node_modules/react-dom/lib/CallbackQueue.js 2.97 KiB {719} [built]
[731] (webpack)/node_modules/react-dom/lib/Danger.js 2.07 KiB {719} [built]
[792] (webpack)/node_modules/react-dom/lib/DOMPropertyOperations.js 7.31 KiB {719} [built]
[821] (webpack)/node_modules/react-dom/lib/DOMProperty.js 7.93 KiB {719} [built]
chunk {779} a033f17ac742bb387b1e.js 44.4 KiB [rendered] [recorded] aggressive splitted
> react-dom [275] ./example.js 2:0-22
[38] (webpack)/node_modules/react-dom/lib/ReactDOMEmptyComponent.js 1.74 KiB {779} [built]
[101] (webpack)/node_modules/react-dom/lib/ReactDOMTextComponent.js 5.56 KiB {779} [built]
[273] (webpack)/node_modules/react-dom/lib/ReactDOMInput.js 12.7 KiB {779} [built]
[355] (webpack)/node_modules/react-dom/lib/ReactDOMSelection.js 6.5 KiB {779} [built]
[613] (webpack)/node_modules/react-dom/lib/ReactDOMSelect.js 6.53 KiB {779} [built]
[626] (webpack)/node_modules/react-dom/lib/ReactDOMIDOperations.js 833 bytes {779} [built]
[680] (webpack)/node_modules/react-dom/lib/ReactDOMFeatureFlags.js 317 bytes {779} [built]
[699] (webpack)/node_modules/react-dom/lib/ReactDOMComponentTree.js 6 KiB {779} [built]
[762] (webpack)/node_modules/react-dom/lib/ReactDOMContainerInfo.js 845 bytes {779} [built]
[927] (webpack)/node_modules/react-dom/lib/ReactDOMOption.js 3.48 KiB {779} [built]
chunk {995} 4b5aa931c86715ce82cf.js 48.2 KiB [rendered] [recorded] aggressive splitted
> react-dom [275] ./example.js 2:0-22
[26] (webpack)/node_modules/react-dom/lib/SyntheticAnimationEvent.js 1.06 KiB {995} [built]
[31] (webpack)/node_modules/react-dom/lib/accumulateInto.js 1.54 KiB {995} [built]
[76] (webpack)/node_modules/react-dom/lib/SyntheticTouchEvent.js 1.13 KiB {995} [built]
[99] (webpack)/node_modules/react-dom/lib/SyntheticMouseEvent.js 1.97 KiB {995} [built]
[126] (webpack)/node_modules/react-dom/lib/SyntheticTransitionEvent.js 1.08 KiB {995} [built]
[127] (webpack)/node_modules/react-dom/lib/SyntheticInputEvent.js 967 bytes {995} [built]
[133] (webpack)/node_modules/react-dom/lib/dangerousStyleValue.js 2.87 KiB {995} [built]
[157] (webpack)/node_modules/react-dom/lib/SyntheticFocusEvent.js 944 bytes {995} [built]
[162] (webpack)/node_modules/react-dom/lib/SyntheticUIEvent.js 1.42 KiB {995} [built]
[236] (webpack)/node_modules/react-dom/lib/createMicrosoftUnsafeLocalFunction.js 688 bytes {995} [built]
[365] (webpack)/node_modules/react-dom/lib/SyntheticClipboardEvent.js 1.02 KiB {995} [built]
[375] (webpack)/node_modules/react-dom/lib/ViewportMetrics.js 482 bytes {995} [built]
[378] (webpack)/node_modules/react-dom/lib/SyntheticEvent.js 9.02 KiB {995} [built]
[512] (webpack)/node_modules/react-dom/lib/SyntheticWheelEvent.js 1.76 KiB {995} [built]
[685] (webpack)/node_modules/react-dom/lib/Transaction.js 9.21 KiB {995} [built]
[724] (webpack)/node_modules/react-dom/lib/adler32.js 1.04 KiB {995} [built]
[737] (webpack)/node_modules/react-dom/lib/SyntheticKeyboardEvent.js 2.52 KiB {995} [built]
[919] (webpack)/node_modules/react-dom/lib/SimpleEventPlugin.js 7.67 KiB {995} [built]
[965] (webpack)/node_modules/react-dom/lib/SyntheticDragEvent.js 949 bytes {995} [built]
[985] (webpack)/node_modules/react-dom/lib/SyntheticCompositionEvent.js 977 bytes {995} [built]
chunk {996} b45be753b5b958e18e5b.js 46.6 KiB [rendered] [recorded] aggressive splitted
> react-dom [275] ./example.js 2:0-22
[45] (webpack)/node_modules/react-dom/lib/shouldUpdateReactComponent.js 1.25 KiB {996} [built]
[66] (webpack)/node_modules/react-dom/lib/getHostComponentFromComposite.js 618 bytes {996} [built]
[255] (webpack)/node_modules/react-dom/lib/isEventSupported.js 1.77 KiB {996} [built]
[340] (webpack)/node_modules/react-dom/lib/getNodeForCharacterOffset.js 1.46 KiB {996} [built]
[406] (webpack)/node_modules/react-dom/lib/getEventTarget.js 888 bytes {996} [built]
[438] (webpack)/node_modules/react-dom/lib/inputValueTracking.js 2.9 KiB {996} [built]
[444] (webpack)/node_modules/react-dom/lib/flattenChildren.js 2.59 KiB {996} [built]
[537] (webpack)/node_modules/react-dom/lib/getEventKey.js 2.68 KiB {996} [built]
[568] (webpack)/node_modules/react-dom/lib/getVendorPrefixedEventName.js 2.68 KiB {996} [built]
[583] (webpack)/node_modules/react-dom/lib/getIteratorFn.js 997 bytes {996} [built]
[585] (webpack)/node_modules/react-dom/lib/isTextInputElement.js 895 bytes {996} [built]
[608] (webpack)/node_modules/react-dom/lib/setTextContent.js 1.3 KiB {996} [built]
[638] (webpack)/node_modules/react-dom/lib/instantiateReactComponent.js 4.82 KiB {996} [built]
[642] (webpack)/node_modules/react-dom/lib/getTextContentAccessor.js 833 bytes {996} [built]
[665] (webpack)/node_modules/react-dom/lib/getEventCharCode.js 1.35 KiB {996} [built]
[708] (webpack)/node_modules/react-dom/lib/renderSubtreeIntoContainer.js 300 bytes {996} [built]
[756] (webpack)/node_modules/react-dom/lib/findDOMNode.js 2.29 KiB {996} [built]
[761] (webpack)/node_modules/react-dom/lib/escapeTextContentForBrowser.js 3.23 KiB {996} [built]
[779] (webpack)/node_modules/react-dom/lib/forEachAccumulated.js 733 bytes {996} [built]
[787] (webpack)/node_modules/react-dom/lib/traverseAllChildren.js 6.75 KiB {996} [built]
[819] (webpack)/node_modules/react-dom/lib/getEventModifierState.js 1.08 KiB {996} [built]
[877] (webpack)/node_modules/react-dom/lib/quoteAttributeValueForBrowser.js 578 bytes {996} [built]
[888] (webpack)/node_modules/react-dom/lib/setInnerHTML.js 3.65 KiB {996} [built]
[898] (webpack)/node_modules/react-dom/lib/reactProdInvariant.js 1.08 KiB {996} [built]
[144] ./example.js 42 bytes {179} [built]
[320] (webpack)/node_modules/object-assign/index.js 2.06 KiB {179} [built]
[426] (webpack)/node_modules/react/cjs/react.production.min.js 6.67 KiB {179} [built]
[784] (webpack)/node_modules/react/index.js 190 bytes {179} [built]
+ 5 hidden chunk modules
chunk {834} 52c0c30d4de980e97b00.js 6.41 KiB [rendered]
> react-dom [144] ./example.js 2:0-22
[316] (webpack)/node_modules/react-dom/index.js 1.33 KiB {834} [built]
[475] (webpack)/node_modules/scheduler/cjs/scheduler.production.min.js 4.88 KiB {834} [built]
[616] (webpack)/node_modules/scheduler/index.js 198 bytes {834} [built]
chunk {967} 3cc97a4d236fcb0292f4.js 106 KiB [rendered] split chunk (cache group: defaultVendors)
> react-dom [144] ./example.js 2:0-22
[967] (webpack)/node_modules/react-dom/cjs/react-dom.production.min.js 106 KiB {967} [built]
```
## Records
```
{
"aggressiveSplits": [
{
"hash": "67bec60f58761ac436d3cc37003c33f3",
"id": 2,
"modules": [
"../../node_modules/create-react-class/factory.js",
"../../node_modules/fbjs/lib/emptyFunction.js",
"../../node_modules/fbjs/lib/emptyObject.js",
"../../node_modules/fbjs/lib/invariant.js",
"../../node_modules/fbjs/lib/warning.js",
"../../node_modules/object-assign/index.js",
"../../node_modules/prop-types/checkPropTypes.js",
"../../node_modules/prop-types/factory.js"
],
"size": 40275
},
{
"hash": "490730058c18ec99608d385ee76176a8",
"id": 1,
"modules": [
"../../node_modules/prop-types/factoryWithTypeCheckers.js",
"../../node_modules/prop-types/lib/ReactPropTypesSecret.js",
"../../node_modules/react/lib/KeyEscapeUtils.js",
"../../node_modules/react/lib/PooledClass.js",
"../../node_modules/react/lib/React.js",
"../../node_modules/react/lib/ReactBaseClasses.js",
"../../node_modules/react/lib/ReactChildren.js",
"../../node_modules/react/lib/ReactCurrentOwner.js",
"../../node_modules/react/lib/ReactDOMFactories.js"
],
"size": 46762
}
],
"aggressiveSplits": [],
"chunks": {
"byName": {},
"byName": {
"main": 0
},
"bySource": {
"0 ./example.js react-dom": 3,
"1 ./example.js react-dom": 7,
"10 ./example.js react-dom": 6,
"11 ./example.js react-dom": 14,
"2 ./example.js react-dom": 9,
"3 ./example.js react-dom": 13,
"4 ./example.js react-dom": 4,
"5 ./example.js react-dom": 5,
"6 ./example.js react-dom": 8,
"7 ./example.js react-dom": 12,
"8 ./example.js react-dom": 11,
"9 ./example.js react-dom": 10
"0 ./example.js react-dom": 2,
"1 ./example.js react-dom": 1
},
"usedIds": [
0,
1,
2,
3,
4,
5,
6,
7,
8,
9,
10,
11,
12,
13,
14
2
]
},
"modules": {
"byIdentifier": {
"../../node_modules/create-react-class/factory.js": 29,
"../../node_modules/fbjs/lib/EventListener.js": 136,
"../../node_modules/fbjs/lib/ExecutionEnvironment.js": 47,
"../../node_modules/fbjs/lib/camelize.js": 93,
"../../node_modules/fbjs/lib/camelizeStyleName.js": 92,
"../../node_modules/fbjs/lib/containsNode.js": 143,
"../../node_modules/fbjs/lib/createArrayFromMixed.js": 84,
"../../node_modules/fbjs/lib/createNodesFromMarkup.js": 83,
"../../node_modules/fbjs/lib/emptyFunction.js": 8,
"../../node_modules/fbjs/lib/emptyObject.js": 10,
"../../node_modules/fbjs/lib/focusNode.js": 89,
"../../node_modules/fbjs/lib/getActiveElement.js": 146,
"../../node_modules/fbjs/lib/getMarkupWrap.js": 85,
"../../node_modules/fbjs/lib/getUnboundedScrollPosition.js": 137,
"../../node_modules/fbjs/lib/hyphenate.js": 96,
"../../node_modules/fbjs/lib/hyphenateStyleName.js": 95,
"../../node_modules/fbjs/lib/invariant.js": 11,
"../../node_modules/fbjs/lib/isNode.js": 145,
"../../node_modules/fbjs/lib/isTextNode.js": 144,
"../../node_modules/fbjs/lib/memoizeStringOnly.js": 97,
"../../node_modules/fbjs/lib/shallowEqual.js": 116,
"../../node_modules/fbjs/lib/warning.js": 7,
"../../node_modules/object-assign/index.js": 3,
"../../node_modules/prop-types/checkPropTypes.js": 26,
"../../node_modules/prop-types/factory.js": 23,
"../../node_modules/prop-types/factoryWithTypeCheckers.js": 24,
"../../node_modules/prop-types/lib/ReactPropTypesSecret.js": 25,
"../../node_modules/react-dom/index.js": 31,
"../../node_modules/react-dom/lib/ARIADOMPropertyConfig.js": 38,
"../../node_modules/react-dom/lib/AutoFocusUtils.js": 88,
"../../node_modules/react-dom/lib/BeforeInputEventPlugin.js": 39,
"../../node_modules/react-dom/lib/CSSProperty.js": 91,
"../../node_modules/react-dom/lib/CSSPropertyOperations.js": 90,
"../../node_modules/react-dom/lib/CallbackQueue.js": 56,
"../../node_modules/react-dom/lib/ChangeEventPlugin.js": 54,
"../../node_modules/react-dom/lib/DOMChildrenOperations.js": 75,
"../../node_modules/react-dom/lib/DOMLazyTree.js": 76,
"../../node_modules/react-dom/lib/DOMNamespaces.js": 77,
"../../node_modules/react-dom/lib/DOMProperty.js": 35,
"../../node_modules/react-dom/lib/DOMPropertyOperations.js": 98,
"../../node_modules/react-dom/lib/Danger.js": 82,
"../../node_modules/react-dom/lib/DefaultEventPluginOrder.js": 67,
"../../node_modules/react-dom/lib/EnterLeaveEventPlugin.js": 68,
"../../node_modules/react-dom/lib/EventPluginHub.js": 41,
"../../node_modules/react-dom/lib/EventPluginRegistry.js": 42,
"../../node_modules/react-dom/lib/EventPluginUtils.js": 43,
"../../node_modules/react-dom/lib/EventPropagators.js": 40,
"../../node_modules/react-dom/lib/FallbackCompositionState.js": 48,
"../../node_modules/react-dom/lib/HTMLDOMPropertyConfig.js": 73,
"../../node_modules/react-dom/lib/KeyEscapeUtils.js": 121,
"../../node_modules/react-dom/lib/LinkedValueUtils.js": 104,
"../../node_modules/react-dom/lib/PooledClass.js": 49,
"../../node_modules/react-dom/lib/ReactBrowserEventEmitter.js": 100,
"../../node_modules/react-dom/lib/ReactChildReconciler.js": 112,
"../../node_modules/react-dom/lib/ReactComponentBrowserEnvironment.js": 74,
"../../node_modules/react-dom/lib/ReactComponentEnvironment.js": 110,
"../../node_modules/react-dom/lib/ReactCompositeComponent.js": 114,
"../../node_modules/react-dom/lib/ReactDOM.js": 32,
"../../node_modules/react-dom/lib/ReactDOMComponent.js": 87,
"../../node_modules/react-dom/lib/ReactDOMComponentFlags.js": 36,
"../../node_modules/react-dom/lib/ReactDOMComponentTree.js": 33,
"../../node_modules/react-dom/lib/ReactDOMContainerInfo.js": 161,
"../../node_modules/react-dom/lib/ReactDOMEmptyComponent.js": 131,
"../../node_modules/react-dom/lib/ReactDOMFeatureFlags.js": 162,
"../../node_modules/react-dom/lib/ReactDOMIDOperations.js": 86,
"../../node_modules/react-dom/lib/ReactDOMInput.js": 103,
"../../node_modules/react-dom/lib/ReactDOMOption.js": 106,
"../../node_modules/react-dom/lib/ReactDOMSelect.js": 107,
"../../node_modules/react-dom/lib/ReactDOMSelection.js": 141,
"../../node_modules/react-dom/lib/ReactDOMTextComponent.js": 133,
"../../node_modules/react-dom/lib/ReactDOMTextarea.js": 108,
"../../node_modules/react-dom/lib/ReactDOMTreeTraversal.js": 132,
"../../node_modules/react-dom/lib/ReactDefaultBatchingStrategy.js": 134,
"../../node_modules/react-dom/lib/ReactDefaultInjection.js": 37,
"../../node_modules/react-dom/lib/ReactElementSymbol.js": 123,
"../../node_modules/react-dom/lib/ReactEmptyComponent.js": 118,
"../../node_modules/react-dom/lib/ReactErrorUtils.js": 44,
"../../node_modules/react-dom/lib/ReactEventEmitterMixin.js": 101,
"../../node_modules/react-dom/lib/ReactEventListener.js": 135,
"../../node_modules/react-dom/lib/ReactFeatureFlags.js": 57,
"../../node_modules/react-dom/lib/ReactHostComponent.js": 119,
"../../node_modules/react-dom/lib/ReactInjection.js": 138,
"../../node_modules/react-dom/lib/ReactInputSelection.js": 140,
"../../node_modules/react-dom/lib/ReactInstanceMap.js": 111,
"../../node_modules/react-dom/lib/ReactInstrumentation.js": 61,
"../../node_modules/react-dom/lib/ReactMarkupChecksum.js": 163,
"../../node_modules/react-dom/lib/ReactMount.js": 160,
"../../node_modules/react-dom/lib/ReactMultiChild.js": 109,
"../../node_modules/react-dom/lib/ReactNodeTypes.js": 115,
"../../node_modules/react-dom/lib/ReactOwner.js": 60,
"../../node_modules/react-dom/lib/ReactPropTypesSecret.js": 105,
"../../node_modules/react-dom/lib/ReactReconcileTransaction.js": 139,
"../../node_modules/react-dom/lib/ReactReconciler.js": 58,
"../../node_modules/react-dom/lib/ReactRef.js": 59,
"../../node_modules/react-dom/lib/ReactServerRenderingTransaction.js": 127,
"../../node_modules/react-dom/lib/ReactServerUpdateQueue.js": 128,
"../../node_modules/react-dom/lib/ReactUpdateQueue.js": 129,
"../../node_modules/react-dom/lib/ReactUpdates.js": 55,
"../../node_modules/react-dom/lib/ReactVersion.js": 165,
"../../node_modules/react-dom/lib/SVGDOMPropertyConfig.js": 147,
"../../node_modules/react-dom/lib/SelectEventPlugin.js": 148,
"../../node_modules/react-dom/lib/SimpleEventPlugin.js": 149,
"../../node_modules/react-dom/lib/SyntheticAnimationEvent.js": 150,
"../../node_modules/react-dom/lib/SyntheticClipboardEvent.js": 151,
"../../node_modules/react-dom/lib/SyntheticCompositionEvent.js": 51,
"../../node_modules/react-dom/lib/SyntheticDragEvent.js": 156,
"../../node_modules/react-dom/lib/SyntheticEvent.js": 52,
"../../node_modules/react-dom/lib/SyntheticFocusEvent.js": 152,
"../../node_modules/react-dom/lib/SyntheticInputEvent.js": 53,
"../../node_modules/react-dom/lib/SyntheticKeyboardEvent.js": 153,
"../../node_modules/react-dom/lib/SyntheticMouseEvent.js": 69,
"../../node_modules/react-dom/lib/SyntheticTouchEvent.js": 157,
"../../node_modules/react-dom/lib/SyntheticTransitionEvent.js": 158,
"../../node_modules/react-dom/lib/SyntheticUIEvent.js": 70,
"../../node_modules/react-dom/lib/SyntheticWheelEvent.js": 159,
"../../node_modules/react-dom/lib/Transaction.js": 62,
"../../node_modules/react-dom/lib/ViewportMetrics.js": 71,
"../../node_modules/react-dom/lib/accumulateInto.js": 45,
"../../node_modules/react-dom/lib/adler32.js": 164,
"../../node_modules/react-dom/lib/createMicrosoftUnsafeLocalFunction.js": 79,
"../../node_modules/react-dom/lib/dangerousStyleValue.js": 94,
"../../node_modules/react-dom/lib/escapeTextContentForBrowser.js": 81,
"../../node_modules/react-dom/lib/findDOMNode.js": 166,
"../../node_modules/react-dom/lib/flattenChildren.js": 126,
"../../node_modules/react-dom/lib/forEachAccumulated.js": 46,
"../../node_modules/react-dom/lib/getEventCharCode.js": 154,
"../../node_modules/react-dom/lib/getEventKey.js": 155,
"../../node_modules/react-dom/lib/getEventModifierState.js": 72,
"../../node_modules/react-dom/lib/getEventTarget.js": 64,
"../../node_modules/react-dom/lib/getHostComponentFromComposite.js": 167,
"../../node_modules/react-dom/lib/getIteratorFn.js": 124,
"../../node_modules/react-dom/lib/getNodeForCharacterOffset.js": 142,
"../../node_modules/react-dom/lib/getTextContentAccessor.js": 50,
"../../node_modules/react-dom/lib/getVendorPrefixedEventName.js": 102,
"../../node_modules/react-dom/lib/inputValueTracking.js": 63,
"../../node_modules/react-dom/lib/instantiateReactComponent.js": 113,
"../../node_modules/react-dom/lib/isEventSupported.js": 65,
"../../node_modules/react-dom/lib/isTextInputElement.js": 66,
"../../node_modules/react-dom/lib/quoteAttributeValueForBrowser.js": 99,
"../../node_modules/react-dom/lib/reactProdInvariant.js": 34,
"../../node_modules/react-dom/lib/renderSubtreeIntoContainer.js": 168,
"../../node_modules/react-dom/lib/setInnerHTML.js": 78,
"../../node_modules/react-dom/lib/setTextContent.js": 80,
"../../node_modules/react-dom/lib/shouldUpdateReactComponent.js": 117,
"../../node_modules/react-dom/lib/traverseAllChildren.js": 122,
"../../node_modules/react-dom/lib/validateDOMNesting.js": 130,
"../../node_modules/react/lib/KeyEscapeUtils.js": 20,
"../../node_modules/react/lib/PooledClass.js": 14,
"../../node_modules/react/lib/React.js": 2,
"../../node_modules/react/lib/ReactBaseClasses.js": 4,
"../../node_modules/react/lib/ReactChildren.js": 13,
"../../node_modules/react/lib/ReactComponentTreeHook.js": 125,
"../../node_modules/react/lib/ReactCurrentOwner.js": 16,
"../../node_modules/react/lib/ReactDOMFactories.js": 21,
"../../node_modules/react/lib/ReactElement.js": 15,
"../../node_modules/react/lib/ReactElementSymbol.js": 17,
"../../node_modules/react/lib/ReactNoopUpdateQueue.js": 6,
"../../node_modules/react/lib/ReactPropTypes.js": 22,
"../../node_modules/react/lib/ReactVersion.js": 27,
"../../node_modules/react/lib/canDefineProperty.js": 9,
"../../node_modules/react/lib/createClass.js": 28,
"../../node_modules/react/lib/getIteratorFn.js": 19,
"../../node_modules/react/lib/getNextDebugID.js": 120,
"../../node_modules/react/lib/lowPriorityWarning.js": 12,
"../../node_modules/react/lib/onlyChild.js": 30,
"../../node_modules/react/lib/reactProdInvariant.js": 5,
"../../node_modules/react/lib/traverseAllChildren.js": 18,
"../../node_modules/react/react.js": 1,
"../../node_modules/react-dom/cjs/react-dom.production.min.js": 5,
"../../node_modules/react-dom/index.js": 4,
"../../node_modules/react/cjs/react.production.min.js": 2,
"../../node_modules/react/index.js": 1,
"../../node_modules/scheduler/cjs/scheduler.production.min.js": 7,
"../../node_modules/scheduler/index.js": 6,
"./example.js": 0
},
"usedIds": [
@ -742,168 +135,7 @@ chunk {996} b45be753b5b958e18e5b.js 46.6 KiB [rendered] [recorded] aggressive sp
4,
5,
6,
7,
8,
9,
10,
11,
12,
13,
14,
15,
16,
17,
18,
19,
20,
21,
22,
23,
24,
25,
26,
27,
28,
29,
30,
31,
32,
33,
34,
35,
36,
37,
38,
39,
40,
41,
42,
43,
44,
45,
46,
47,
48,
49,
50,
51,
52,
53,
54,
55,
56,
57,
58,
59,
60,
61,
62,
63,
64,
65,
66,
67,
68,
69,
70,
71,
72,
73,
74,
75,
76,
77,
78,
79,
80,
81,
82,
83,
84,
85,
86,
87,
88,
89,
90,
91,
92,
93,
94,
95,
96,
97,
98,
99,
100,
101,
102,
103,
104,
105,
106,
107,
108,
109,
110,
111,
112,
113,
114,
115,
116,
117,
118,
119,
120,
121,
122,
123,
124,
125,
126,
127,
128,
129,
130,
131,
132,
133,
134,
135,
136,
137,
138,
139,
140,
141,
142,
143,
144,
145,
146,
147,
148,
149,
150,
151,
152,
153,
154,
155,
156,
157,
158,
159,
160,
161,
162,
163,
164,
165,
166,
167,
168
7
]
}
}

View File

@ -16,8 +16,8 @@ The compression improves with bigger `maxSize`, as gzip works better for bigger
The backward compatibility (non HTTP2 client) improves with bigger `maxSize`, as the number of requests decreases.
``` js
{{webpack.config.js}}
```js
_{{webpack.config.js}}_
```
# Info
@ -25,17 +25,17 @@ The backward compatibility (non HTTP2 client) improves with bigger `maxSize`, as
## Unoptimized
```
{{stdout}}
_{{stdout}}_
```
## Production mode
```
{{production:stdout}}
_{{production:stdout}}_
```
## Records
```
{{dist/records.json}}
_{{dist/records.json}}_
```

View File

@ -1,6 +1,6 @@
# webpack.config.js
``` javascript
```javascript
var path = require("path");
module.exports = {
// mode: "development || "production",
@ -30,7 +30,7 @@ module.exports = {
# aEntry.js
``` javascript
```javascript
// Just show the page "a"
var render = require("./render");
render(require("./aPage"));
@ -40,7 +40,7 @@ render(require("./aPage"));
# aPage.js
``` javascript
```javascript
module.exports = function() {
return "This is page A.";
};
@ -50,7 +50,7 @@ module.exports = function() {
# router.js
``` javascript
```javascript
var render = require("./render");
// Event when another page should be opened
@ -73,7 +73,7 @@ window.onLinkToPage = function onLinkToPage(name) { // name is "a" or "b"
# pageA.html
``` html
```html
<html>
<head></head>
<body>
@ -151,16 +151,16 @@ var map = {
]
};
function webpackAsyncContext(req) {
var ids = map[req];
if(!ids) {
if(!Object.prototype.hasOwnProperty.call(map, req)) {
return Promise.resolve().then(function() {
var e = new Error("Cannot find module '" + req + "'");
e.code = 'MODULE_NOT_FOUND';
throw e;
});
}
var ids = map[req], id = ids[0];
return __webpack_require__.e(ids[1]).then(function() {
var id = ids[0];
return __webpack_require__.t(id, 7);
});
}
@ -178,7 +178,7 @@ module.exports = webpackAsyncContext;
<details><summary><code>/******/ (function(modules) { /* webpackBootstrap */ })</code></summary>
``` javascript
```javascript
/******/ (function(modules, runtime) { // webpackBootstrap
/******/ "use strict";
/******/ // The module cache
@ -224,7 +224,7 @@ module.exports = webpackAsyncContext;
</details>
``` javascript
```javascript
/******/ ([
/* 0 */
/*!*******************!*\
@ -306,8 +306,7 @@ render(__webpack_require__(/*! ./aPage */ 2));
/******/
/******/ /* webpack/runtime/get javascript chunk filename */
/******/ !function() {
/******/
/******/ // This function only allows to reference on-demand chunks
/******/ // This function allow to reference async chunks
/******/ __webpack_require__.u = function(chunkId) {
/******/ // return url for filenames based on template
/******/ return "" + chunkId + ".chunk.js";
@ -465,7 +464,7 @@ render(__webpack_require__(/*! ./aPage */ 2));
# dist/aPage.chunk.js
``` javascript
```javascript
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([["aPage"],{
/***/ 2:
@ -491,13 +490,13 @@ module.exports = function() {
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
aPage.chunk.js 365 bytes {aPage} [emitted] aPage
bPage.chunk.js 365 bytes {bPage} [emitted] bPage
pageA.bundle.js 10.4 KiB {pageA} [emitted] pageA
pageB.bundle.js 10.4 KiB {pageB} [emitted] pageB
router_js.bundle.js 2.39 KiB {router_js} [emitted]
pageA.bundle.js 10.3 KiB {pageA} [emitted] pageA
pageB.bundle.js 10.3 KiB {pageB} [emitted] pageB
router_js.bundle.js 2.42 KiB {router_js} [emitted]
Entrypoint pageA = router_js.bundle.js aPage.chunk.js pageA.bundle.js
Entrypoint pageB = router_js.bundle.js bPage.chunk.js pageB.bundle.js
chunk {aPage} aPage.chunk.js (aPage) 59 bytes [initial] [rendered] reused as split chunk (cache group: default)
@ -516,14 +515,14 @@ chunk {bPage} bPage.chunk.js (bPage) 59 bytes [initial] [rendered] reused as spl
[used exports unknown]
context element ./bPage [4] . lazy ^\.\/.*Page$ namespace object ./bPage
cjs require ./bPage [5] ./bEntry.js 3:7-25
chunk {pageA} pageA.bundle.js (pageA) 87 bytes (javascript) 5.9 KiB (runtime) [entry] [rendered]
chunk {pageA} pageA.bundle.js (pageA) 87 bytes (javascript) 5.89 KiB (runtime) [entry] [rendered]
> ./aEntry pageA
> ./router pageA
[0] ./aEntry.js 87 bytes {pageA} [built]
[used exports unknown]
entry ./aEntry pageA
+ 7 hidden chunk modules
chunk {pageB} pageB.bundle.js (pageB) 87 bytes (javascript) 5.9 KiB (runtime) [entry] [rendered]
chunk {pageB} pageB.bundle.js (pageB) 87 bytes (javascript) 5.89 KiB (runtime) [entry] [rendered]
> ./bEntry pageB
> ./router pageB
[5] ./bEntry.js 87 bytes {pageB} [built]
@ -553,39 +552,39 @@ chunk {router_js} router_js.bundle.js 950 bytes [initial] [rendered] split chunk
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
aPage.chunk.js 129 bytes {aPage} [emitted] aPage
bPage.chunk.js 129 bytes {bPage} [emitted] bPage
pageA.bundle.js 2.27 KiB {pageA} [emitted] pageA
pageB.bundle.js 2.27 KiB {pageB} [emitted] pageB
router_js.bundle.js 583 bytes {router_js} [emitted]
router_js.bundle.js 630 bytes {router_js} [emitted]
Entrypoint pageA = router_js.bundle.js aPage.chunk.js pageA.bundle.js
Entrypoint pageB = router_js.bundle.js bPage.chunk.js pageB.bundle.js
chunk {aPage} aPage.chunk.js (aPage) 59 bytes [initial] [rendered] reused as split chunk (cache group: default)
> ./aPage [843] . lazy ^\.\/.*Page$ namespace object ./aPage
> ./aPage [245] . lazy ^\.\/.*Page$ namespace object ./aPage
> ./aEntry pageA
> ./router pageA
[262] ./aPage.js 59 bytes {aPage} [built]
context element ./aPage [843] . lazy ^\.\/.*Page$ namespace object ./aPage
cjs require ./aPage [876] ./aEntry.js 3:7-25
[970] ./aPage.js 59 bytes {aPage} [built]
context element ./aPage [245] . lazy ^\.\/.*Page$ namespace object ./aPage
cjs require ./aPage [557] ./aEntry.js 3:7-25
chunk {bPage} bPage.chunk.js (bPage) 59 bytes [initial] [rendered] reused as split chunk (cache group: default)
> ./bPage [843] . lazy ^\.\/.*Page$ namespace object ./bPage
> ./bPage [245] . lazy ^\.\/.*Page$ namespace object ./bPage
> ./bEntry pageB
> ./router pageB
[542] ./bPage.js 59 bytes {bPage} [built]
cjs require ./bPage [261] ./bEntry.js 3:7-25
context element ./bPage [843] . lazy ^\.\/.*Page$ namespace object ./bPage
chunk {pageA} pageA.bundle.js (pageA) 87 bytes (javascript) 5.91 KiB (runtime) [entry] [rendered]
[194] ./bPage.js 59 bytes {bPage} [built]
context element ./bPage [245] . lazy ^\.\/.*Page$ namespace object ./bPage
cjs require ./bPage [857] ./bEntry.js 3:7-25
chunk {pageA} pageA.bundle.js (pageA) 87 bytes (javascript) 5.9 KiB (runtime) [entry] [rendered]
> ./aEntry pageA
> ./router pageA
[876] ./aEntry.js 87 bytes {pageA} [built]
[557] ./aEntry.js 87 bytes {pageA} [built]
entry ./aEntry pageA
+ 7 hidden chunk modules
chunk {pageB} pageB.bundle.js (pageB) 87 bytes (javascript) 5.91 KiB (runtime) [entry] [rendered]
chunk {pageB} pageB.bundle.js (pageB) 87 bytes (javascript) 5.9 KiB (runtime) [entry] [rendered]
> ./bEntry pageB
> ./router pageB
[261] ./bEntry.js 87 bytes {pageB} [built]
[857] ./bEntry.js 87 bytes {pageB} [built]
entry ./bEntry pageB
+ 7 hidden chunk modules
chunk {router_js} router_js.bundle.js 950 bytes [initial] [rendered] split chunk (cache group: default)
@ -593,13 +592,13 @@ chunk {router_js} router_js.bundle.js 950 bytes [initial] [rendered] split chunk
> ./router pageA
> ./bEntry pageB
> ./router pageB
[372] ./router.js 732 bytes {router_js} [built]
[245] . lazy ^\.\/.*Page$ namespace object 160 bytes {router_js} [built]
import() context lazy . [840] ./router.js 15:1-59
[840] ./router.js 732 bytes {router_js} [built]
entry ./router pageA
entry ./router pageB
[760] ./render.js 58 bytes {router_js} [built]
cjs require ./render [261] ./bEntry.js 2:13-32
cjs require ./render [372] ./router.js 1:13-32
cjs require ./render [876] ./aEntry.js 2:13-32
[843] . lazy ^\.\/.*Page$ namespace object 160 bytes {router_js} [built]
import() context lazy . [372] ./router.js 15:1-59
[956] ./render.js 58 bytes {router_js} [built]
cjs require ./render [557] ./aEntry.js 2:13-32
cjs require ./render [840] ./router.js 1:13-32
cjs require ./render [857] ./bEntry.js 2:13-32
```

View File

@ -1,53 +1,53 @@
# webpack.config.js
``` javascript
{{webpack.config.js}}
```javascript
_{{webpack.config.js}}_
```
# aEntry.js
``` javascript
{{aEntry.js}}
```javascript
_{{aEntry.js}}_
```
`bEntry.js` is similar. You may want to use a loader to generate this file.
# aPage.js
``` javascript
{{aPage.js}}
```javascript
_{{aPage.js}}_
```
`bEntry.js` is similar.
# router.js
``` javascript
{{router.js}}
```javascript
_{{router.js}}_
```
# pageA.html
``` html
{{pageA.html}}
```html
_{{pageA.html}}_
```
# dist/router_js.bundle.js
``` javascript
{{dist/router_js.bundle.js}}
_{{dist/router_js.bundle.js}}_
```
# dist/pageA.bundle.js
``` javascript
{{dist/pageA.bundle.js}}
```javascript
_{{dist/pageA.bundle.js}}_
```
# dist/aPage.chunk.js
``` javascript
{{dist/aPage.chunk.js}}
```javascript
_{{dist/aPage.chunk.js}}_
```
# Info
@ -55,11 +55,11 @@
## Unoptimized
```
{{stdout}}
_{{stdout}}_
```
## Production mode
```
{{production:stdout}}
_{{production:stdout}}_
```

View File

@ -1,317 +0,0 @@
This example uses the I18nPlugin in combination with the multi-compiler feature.
The `webpack.config.js` exports an array of all config combinations that should be compiled. In this example two different parameters for the I18nPlugin are used.
The I18nPlugin replaces every occurrence of the i18n function `__(...)` with a const string. i. e. `__("Hello World")` with `"Hello World"` resp. `"Hallo Welt"`.
# example.js
``` javascript
console.log(__("Hello World"));
console.log(__("Missing Text"));
```
# webpack.config.js
``` javascript
var path = require("path");
var I18nPlugin = require("i18n-webpack-plugin");
var languages = {
en: null,
de: require("./de.json")
};
module.exports = Object.keys(languages).map(function(language) {
return {
name: language,
// mode: "development || "production",
entry: "./example",
output: {
path: path.join(__dirname, "dist"),
filename: language + ".output.js"
},
plugins: [new I18nPlugin(languages[language])]
};
});
```
# de.json
``` javascript
{
"Hello World": "Hallo Welt"
}
```
# dist/de.output.js
<details><summary><code>/******/ (function(modules) { /* webpackBootstrap */ })</code></summary>
``` javascript
/******/ (function(modules) { // webpackBootstrap
/******/ // The module cache
/******/ var installedModules = {};
/******/
/******/ // The require function
/******/ function __webpack_require__(moduleId) {
/******/
/******/ // Check if module is in cache
/******/ if(installedModules[moduleId]) {
/******/ return installedModules[moduleId].exports;
/******/ }
/******/ // Create a new module (and put it into the cache)
/******/ var module = installedModules[moduleId] = {
/******/ i: moduleId,
/******/ l: false,
/******/ exports: {}
/******/ };
/******/
/******/ // Execute the module function
/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
/******/
/******/ // Flag the module as loaded
/******/ module.l = true;
/******/
/******/ // Return the exports of the module
/******/ return module.exports;
/******/ }
/******/
/******/
/******/ // expose the modules object (__webpack_modules__)
/******/ __webpack_require__.m = modules;
/******/
/******/ // expose the module cache
/******/ __webpack_require__.c = installedModules;
/******/
/******/ // define getter function for harmony exports
/******/ __webpack_require__.d = function(exports, name, getter) {
/******/ if(!__webpack_require__.o(exports, name)) {
/******/ Object.defineProperty(exports, name, { enumerable: true, get: getter });
/******/ }
/******/ };
/******/
/******/ // define __esModule on exports
/******/ __webpack_require__.r = function(exports) {
/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
/******/ }
/******/ Object.defineProperty(exports, '__esModule', { value: true });
/******/ };
/******/
/******/ // create a fake namespace object
/******/ // mode & 1: value is a module id, require it
/******/ // mode & 2: merge all properties of value into the ns
/******/ // mode & 4: return value when already ns object
/******/ // mode & 8|1: behave like require
/******/ __webpack_require__.t = function(value, mode) {
/******/ if(mode & 1) value = __webpack_require__(value);
/******/ if(mode & 8) return value;
/******/ if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value;
/******/ var ns = Object.create(null);
/******/ __webpack_require__.r(ns);
/******/ Object.defineProperty(ns, 'default', { enumerable: true, value: value });
/******/ if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key));
/******/ return ns;
/******/ };
/******/
/******/ // getDefaultExport function for compatibility with non-harmony modules
/******/ __webpack_require__.n = function(module) {
/******/ var getter = module && module.__esModule ?
/******/ function getDefault() { return module['default']; } :
/******/ function getModuleExports() { return module; };
/******/ __webpack_require__.d(getter, 'a', getter);
/******/ return getter;
/******/ };
/******/
/******/ // Object.prototype.hasOwnProperty.call
/******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
/******/
/******/ // __webpack_public_path__
/******/ __webpack_require__.p = "dist/";
/******/
/******/
/******/ // Load entry module and return exports
/******/ return __webpack_require__(__webpack_require__.s = 0);
/******/ })
/************************************************************************/
```
</details>
``` javascript
/******/ ([
/* 0 */
/*!********************!*\
!*** ./example.js ***!
\********************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
console.log("Hallo Welt");
console.log("Missing Text");
/***/ })
/******/ ]);
```
# dist/en.output.js
``` javascript
/******/ (function(modules) { // webpackBootstrap
/******/ // The module cache
/******/ var installedModules = {};
/******/
/******/ // The require function
/******/ function __webpack_require__(moduleId) {
/******/
/******/ // Check if module is in cache
/******/ if(installedModules[moduleId]) {
/******/ return installedModules[moduleId].exports;
/******/ }
/******/ // Create a new module (and put it into the cache)
/******/ var module = installedModules[moduleId] = {
/******/ i: moduleId,
/******/ l: false,
/******/ exports: {}
/******/ };
/******/
/******/ // Execute the module function
/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
/******/
/******/ // Flag the module as loaded
/******/ module.l = true;
/******/
/******/ // Return the exports of the module
/******/ return module.exports;
/******/ }
/******/
/******/
/******/ // expose the modules object (__webpack_modules__)
/******/ __webpack_require__.m = modules;
/******/
/******/ // expose the module cache
/******/ __webpack_require__.c = installedModules;
/******/
/******/ // define getter function for harmony exports
/******/ __webpack_require__.d = function(exports, name, getter) {
/******/ if(!__webpack_require__.o(exports, name)) {
/******/ Object.defineProperty(exports, name, { enumerable: true, get: getter });
/******/ }
/******/ };
/******/
/******/ // define __esModule on exports
/******/ __webpack_require__.r = function(exports) {
/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
/******/ }
/******/ Object.defineProperty(exports, '__esModule', { value: true });
/******/ };
/******/
/******/ // create a fake namespace object
/******/ // mode & 1: value is a module id, require it
/******/ // mode & 2: merge all properties of value into the ns
/******/ // mode & 4: return value when already ns object
/******/ // mode & 8|1: behave like require
/******/ __webpack_require__.t = function(value, mode) {
/******/ if(mode & 1) value = __webpack_require__(value);
/******/ if(mode & 8) return value;
/******/ if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value;
/******/ var ns = Object.create(null);
/******/ __webpack_require__.r(ns);
/******/ Object.defineProperty(ns, 'default', { enumerable: true, value: value });
/******/ if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key));
/******/ return ns;
/******/ };
/******/
/******/ // getDefaultExport function for compatibility with non-harmony modules
/******/ __webpack_require__.n = function(module) {
/******/ var getter = module && module.__esModule ?
/******/ function getDefault() { return module['default']; } :
/******/ function getModuleExports() { return module; };
/******/ __webpack_require__.d(getter, 'a', getter);
/******/ return getter;
/******/ };
/******/
/******/ // Object.prototype.hasOwnProperty.call
/******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
/******/
/******/ // __webpack_public_path__
/******/ __webpack_require__.p = "dist/";
/******/
/******/
/******/ // Load entry module and return exports
/******/ return __webpack_require__(__webpack_require__.s = 0);
/******/ })
/************************************************************************/
/******/ ([
/* 0 */
/*!********************!*\
!*** ./example.js ***!
\********************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
console.log("Hello World");
console.log("Missing Text");
/***/ })
/******/ ]);
```
# Info
## Unoptimized
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 4.28.0
Child en:
Hash: 0a1b2c3d4e5f6a7b8c9d
Asset Size Chunks Chunk Names
en.output.js 3.76 KiB 0 [emitted] main
Entrypoint main = en.output.js
chunk {0} en.output.js (main) 64 bytes [entry] [rendered]
> ./example main
[0] ./example.js 64 bytes {0} [built]
single entry ./example main
Child de:
Hash: 0a1b2c3d4e5f6a7b8c9d
Asset Size Chunks Chunk Names
de.output.js 3.76 KiB 0 [emitted] main
Entrypoint main = de.output.js
chunk {0} de.output.js (main) 64 bytes [entry] [rendered]
> ./example main
[0] ./example.js 64 bytes {0} [built] [1 warning]
single entry ./example main
WARNING in ./example.js
Missing localization: Missing Text
```
## Production mode
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 4.28.0
Child en:
Hash: 0a1b2c3d4e5f6a7b8c9d
Asset Size Chunks Chunk Names
en.output.js 991 bytes 0 [emitted] main
Entrypoint main = en.output.js
chunk {0} en.output.js (main) 64 bytes [entry] [rendered]
> ./example main
[0] ./example.js 64 bytes {0} [built]
single entry ./example main
Child de:
Hash: 0a1b2c3d4e5f6a7b8c9d
Asset Size Chunks Chunk Names
de.output.js 990 bytes 0 [emitted] main
Entrypoint main = de.output.js
chunk {0} de.output.js (main) 64 bytes [entry] [rendered]
> ./example main
[0] ./example.js 64 bytes {0} [built] [1 warning]
single entry ./example main
WARNING in ./example.js
Missing localization: Missing Text
```

View File

@ -1,6 +1,6 @@
# example.js
``` javascript
```javascript
// use our loader
console.dir(require("./loader!./file"));
@ -11,13 +11,13 @@ console.dir(require("!css-loader!./test.css")); // manual
# file.js
``` javascript
```javascript
exports.foo = "bar";
```
# loader.js
``` javascript
```javascript
module.exports = function(content) {
return "exports.answer = 42;\n" + content;
}
@ -25,7 +25,7 @@ module.exports = function(content) {
# test.css
``` css
```css
.some-class {
color: hotpink;
}
@ -35,7 +35,7 @@ module.exports = function(content) {
<details><summary><code>/******/ (function(modules) { /* webpackBootstrap */ })</code></summary>
``` javascript
```javascript
/******/ (function(modules, runtime) { // webpackBootstrap
/******/ "use strict";
/******/ // The module cache
@ -81,7 +81,7 @@ module.exports = function(content) {
</details>
``` javascript
```javascript
/******/ ([
/* 0 */
/*!********************!*\
@ -113,110 +113,115 @@ exports.foo = "bar";
/***/ }),
/* 2 */
/*!****************************************************!*\
!*** (webpack)/node_modules/css-loader!./test.css ***!
\****************************************************/
/*!****************************************************************!*\
!*** (webpack)/node_modules/css-loader/dist/cjs.js!./test.css ***!
\****************************************************************/
/*! other exports [maybe provided (runtime-defined)] [no usage info] */
/*! runtime requirements: __webpack_exports__module, __webpack_require__, */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../node_modules/css-loader/lib/css-base.js */ 3)(false);
// imports
// module
exports = module.exports = __webpack_require__(/*! ../../node_modules/css-loader/dist/runtime/api.js */ 3)(false);
// Module
exports.push([module.i, ".some-class {\n\tcolor: hotpink;\n}\n", ""]);
// exports
/***/ }),
/* 3 */
/*!*********************************************************!*\
!*** (webpack)/node_modules/css-loader/lib/css-base.js ***!
\*********************************************************/
/*!*************************************************************!*\
!*** (webpack)/node_modules/css-loader/dist/runtime/api.js ***!
\*************************************************************/
/*! other exports [maybe provided (runtime-defined)] [no usage info] */
/*! runtime requirements: module */
/***/ (function(module) {
"use strict";
/*
MIT License http://www.opensource.org/licenses/mit-license.php
Author Tobias Koppers @sokra
MIT License http://www.opensource.org/licenses/mit-license.php
Author Tobias Koppers @sokra
*/
// css base code, injected by the css-loader
module.exports = function(useSourceMap) {
var list = [];
module.exports = function (useSourceMap) {
var list = []; // return the list of modules as css string
// return the list of modules as css string
list.toString = function toString() {
return this.map(function (item) {
var content = cssWithMappingToString(item, useSourceMap);
if(item[2]) {
return "@media " + item[2] + "{" + content + "}";
} else {
return content;
}
}).join("");
};
list.toString = function toString() {
return this.map(function (item) {
var content = cssWithMappingToString(item, useSourceMap);
// import a list of modules into the list
list.i = function(modules, mediaQuery) {
if(typeof modules === "string")
modules = [[null, modules, ""]];
var alreadyImportedModules = {};
for(var i = 0; i < this.length; i++) {
var id = this[i][0];
if(typeof id === "number")
alreadyImportedModules[id] = true;
}
for(i = 0; i < modules.length; i++) {
var item = modules[i];
// skip already imported module
// this implementation is not 100% perfect for weird media query combinations
// when a module is imported multiple times with different media queries.
// I hope this will never occur (Hey this way we have smaller bundles)
if(typeof item[0] !== "number" || !alreadyImportedModules[item[0]]) {
if(mediaQuery && !item[2]) {
item[2] = mediaQuery;
} else if(mediaQuery) {
item[2] = "(" + item[2] + ") and (" + mediaQuery + ")";
}
list.push(item);
}
}
};
return list;
if (item[2]) {
return '@media ' + item[2] + '{' + content + '}';
} else {
return content;
}
}).join('');
}; // import a list of modules into the list
list.i = function (modules, mediaQuery) {
if (typeof modules === 'string') {
modules = [[null, modules, '']];
}
var alreadyImportedModules = {};
for (var i = 0; i < this.length; i++) {
var id = this[i][0];
if (id != null) {
alreadyImportedModules[id] = true;
}
}
for (i = 0; i < modules.length; i++) {
var item = modules[i]; // skip already imported module
// this implementation is not 100% perfect for weird media query combinations
// when a module is imported multiple times with different media queries.
// I hope this will never occur (Hey this way we have smaller bundles)
if (item[0] == null || !alreadyImportedModules[item[0]]) {
if (mediaQuery && !item[2]) {
item[2] = mediaQuery;
} else if (mediaQuery) {
item[2] = '(' + item[2] + ') and (' + mediaQuery + ')';
}
list.push(item);
}
}
};
return list;
};
function cssWithMappingToString(item, useSourceMap) {
var content = item[1] || '';
var cssMapping = item[3];
if (!cssMapping) {
return content;
}
var content = item[1] || '';
var cssMapping = item[3];
if (useSourceMap && typeof btoa === 'function') {
var sourceMapping = toComment(cssMapping);
var sourceURLs = cssMapping.sources.map(function (source) {
return '/*# sourceURL=' + cssMapping.sourceRoot + source + ' */'
});
if (!cssMapping) {
return content;
}
return [content].concat(sourceURLs).concat([sourceMapping]).join('\n');
}
if (useSourceMap && typeof btoa === 'function') {
var sourceMapping = toComment(cssMapping);
var sourceURLs = cssMapping.sources.map(function (source) {
return '/*# sourceURL=' + cssMapping.sourceRoot + source + ' */';
});
return [content].concat(sourceURLs).concat([sourceMapping]).join('\n');
}
return [content].join('\n');
} // Adapted from convert-source-map (MIT)
return [content].join('\n');
}
// Adapted from convert-source-map (MIT)
function toComment(sourceMap) {
// eslint-disable-next-line no-undef
var base64 = btoa(unescape(encodeURIComponent(JSON.stringify(sourceMap))));
var data = 'sourceMappingURL=data:application/json;charset=utf-8;base64,' + base64;
return '/*# ' + data + ' */';
// eslint-disable-next-line no-undef
var base64 = btoa(unescape(encodeURIComponent(JSON.stringify(sourceMap))));
var data = 'sourceMappingURL=data:application/json;charset=utf-8;base64,' + base64;
return '/*# ' + data + ' */';
}
/***/ })
/******/ ]);
```
@ -237,11 +242,11 @@ Prints in node.js (`enhanced-require example.js`) and in browser:
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
output.js 5.28 KiB {0} [emitted] main
output.js 5.45 KiB {0} [emitted] main
Entrypoint main = output.js
chunk {0} output.js (main) 2.64 KiB [entry] [rendered]
chunk {0} output.js (main) 2.76 KiB [entry] [rendered]
> ./example.js main
[0] ./example.js 204 bytes {0} [built]
[used exports unknown]
@ -249,32 +254,32 @@ chunk {0} output.js (main) 2.64 KiB [entry] [rendered]
[1] ./loader.js!./file.js 41 bytes {0} [built]
[used exports unknown]
cjs require ./loader!./file [0] ./example.js 2:12-38
[2] (webpack)/node_modules/css-loader!./test.css 199 bytes {0} [built]
[2] (webpack)/node_modules/css-loader/dist/cjs.js!./test.css 179 bytes {0} [built]
[used exports unknown]
cjs require ./test.css [0] ./example.js 5:12-33
cjs require !css-loader!./test.css [0] ./example.js 6:12-45
[3] (webpack)/node_modules/css-loader/lib/css-base.js 2.21 KiB {0} [built]
[3] (webpack)/node_modules/css-loader/dist/runtime/api.js 2.35 KiB {0} [built]
[used exports unknown]
cjs require ../../node_modules/css-loader/lib/css-base.js [2] (webpack)/node_modules/css-loader!./test.css 1:27-83
cjs require ../../node_modules/css-loader/dist/runtime/api.js [2] (webpack)/node_modules/css-loader/dist/cjs.js!./test.css 1:27-87
```
## Production mode
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
output.js 1.18 KiB {404} [emitted] main
output.js 1.17 KiB {179} [emitted] main
Entrypoint main = output.js
chunk {404} output.js (main) 2.64 KiB [entry] [rendered]
chunk {179} output.js (main) 2.76 KiB [entry] [rendered]
> ./example.js main
[49] (webpack)/node_modules/css-loader!./test.css 199 bytes {404} [built]
cjs require ./test.css [275] ./example.js 5:12-33
cjs require !css-loader!./test.css [275] ./example.js 6:12-45
[214] (webpack)/node_modules/css-loader/lib/css-base.js 2.21 KiB {404} [built]
cjs require ../../node_modules/css-loader/lib/css-base.js [49] (webpack)/node_modules/css-loader!./test.css 1:27-83
[275] ./example.js 204 bytes {404} [built]
[90] (webpack)/node_modules/css-loader/dist/cjs.js!./test.css 179 bytes {179} [built]
cjs require ./test.css [144] ./example.js 5:12-33
cjs require !css-loader!./test.css [144] ./example.js 6:12-45
[144] ./example.js 204 bytes {179} [built]
entry ./example.js main
[324] ./loader.js!./file.js 41 bytes {404} [built]
cjs require ./loader!./file [275] ./example.js 2:12-38
[232] ./loader.js!./file.js 41 bytes {179} [built]
cjs require ./loader!./file [144] ./example.js 2:12-38
[609] (webpack)/node_modules/css-loader/dist/runtime/api.js 2.35 KiB {179} [built]
cjs require ../../node_modules/css-loader/dist/runtime/api.js [90] (webpack)/node_modules/css-loader/dist/cjs.js!./test.css 1:27-87
```

View File

@ -1,31 +1,31 @@
# example.js
``` javascript
{{example.js}}
```javascript
_{{example.js}}_
```
# file.js
``` javascript
{{file.js}}
```javascript
_{{file.js}}_
```
# loader.js
``` javascript
{{loader.js}}
```javascript
_{{loader.js}}_
```
# test.css
``` css
{{test.css}}
```css
_{{test.css}}_
```
# dist/output.js
``` javascript
{{dist/output.js}}
```javascript
_{{dist/output.js}}_
```
# Console output
@ -43,11 +43,11 @@ Prints in node.js (`enhanced-require example.js`) and in browser:
## Unoptimized
```
{{stdout}}
_{{stdout}}_
```
## Production mode
```
{{production:stdout}}
_{{production:stdout}}_
```

View File

@ -6,15 +6,15 @@ This example application contains 7 pages, each of them importing 1-3 modules fr
The following configuration is used:
* `optimization.splitChunks.chunks: "all"` - This opt-in into automatic splitting of initial chunks which is off by default
* `optimization.splitChunks.maxInitial/AsyncRequests: 20` - This opt-in into a HTTP2 optimized splitting mode by increasing the allowed amount of requests. Browser only supports 6 requests in parallel for HTTP1.1.
- `optimization.splitChunks.chunks: "all"` - This opt-in into automatic splitting of initial chunks which is off by default
- `optimization.splitChunks.maxInitial/AsyncRequests: 20` - This opt-in into a HTTP2 optimized splitting mode by increasing the allowed amount of requests. Browser only supports 6 requests in parallel for HTTP1.1.
# Interpreting the result
* `pageA.js` the normal output files for the entrypoint `pageA`
* `vendors~pageD~pageE~pageF~pageG.js` vendor libs shared by these pages extracted into a separate output file when larger then the threshold in size
* `vendors~pageA.js` vendors only used by a single page but larger than the threshold in size
* `pageA~pageD~pageF.js` application modules shared by these pages and larger than the threshold in size
- `pageA.js` the normal output files for the entrypoint `pageA`
- `vendors~pageD~pageE~pageF~pageG.js` vendor libs shared by these pages extracted into a separate output file when larger then the threshold in size
- `vendors~pageA.js` vendors only used by a single page but larger than the threshold in size
- `pageA~pageD~pageF.js` application modules shared by these pages and larger than the threshold in size
The threshold is here 40 bytes, but by default (in a real application) 30kb.
@ -52,99 +52,99 @@ module.exports = {
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
1.js 116 bytes {1} [emitted]
109.js 121 bytes {109} [emitted]
177.js 121 bytes {177} [emitted]
261.js 156 bytes {261} [emitted]
589.js 180 bytes {589} [emitted]
650.js 179 bytes {650} [emitted]
792.js 121 bytes {792} [emitted]
pageA.js 1.35 KiB {641} [emitted] pageA
pageB.js 1.43 KiB {791} [emitted] pageB
pageC.js 1.43 KiB {42} [emitted] pageC
pageD.js 1.34 KiB {728} [emitted] pageD
pageE.js 1.32 KiB {238} [emitted] pageE
pageF.js 1.34 KiB {636} [emitted] pageF
pageG.js 1.31 KiB {829} [emitted] pageG
Entrypoint pageA = 589.js 792.js 261.js pageA.js
Entrypoint pageB = 589.js 109.js pageB.js
Entrypoint pageC = 589.js 177.js pageC.js
Entrypoint pageD = 1.js 650.js 261.js pageD.js
Entrypoint pageE = 1.js 650.js pageE.js
Entrypoint pageF = 1.js 650.js 261.js pageF.js
Entrypoint pageG = 1.js pageG.js
chunk {1} 1.js 43 bytes [initial] [rendered] split chunk (cache group: defaultVendors)
115.js 180 bytes {115} [emitted]
402.js 121 bytes {402} [emitted]
497.js 121 bytes {497} [emitted]
505.js 156 bytes {505} [emitted]
730.js 121 bytes {730} [emitted]
777.js 121 bytes {777} [emitted]
833.js 180 bytes {833} [emitted]
pageA.js 1.34 KiB {424} [emitted] pageA
pageB.js 1.43 KiB {121} [emitted] pageB
pageC.js 1.43 KiB {178} [emitted] pageC
pageD.js 1.35 KiB {568} [emitted] pageD
pageE.js 1.33 KiB {356} [emitted] pageE
pageF.js 1.35 KiB {789} [emitted] pageF
pageG.js 1.31 KiB {547} [emitted] pageG
Entrypoint pageA = 115.js 730.js 505.js pageA.js
Entrypoint pageB = 115.js 497.js pageB.js
Entrypoint pageC = 115.js 402.js pageC.js
Entrypoint pageD = 777.js 833.js 505.js pageD.js
Entrypoint pageE = 777.js 833.js pageE.js
Entrypoint pageF = 777.js 833.js 505.js pageF.js
Entrypoint pageG = 777.js pageG.js
chunk {115} 115.js 86 bytes [initial] [rendered] split chunk (cache group: defaultVendors)
> ./pages/a pageA
> ./pages/b pageB
> ./pages/c pageC
[394] ./node_modules/m1.js 43 bytes {115} [built]
[947] ./node_modules/m2.js 43 bytes {115} [built]
chunk {121} pageB.js (pageB) 199 bytes (javascript) 3.12 KiB (runtime) [entry] [rendered]
> ./pages/b pageB
[8] ./pages/b.js 106 bytes {121} [built]
[175] ./stuff/s8.js 31 bytes {121} [built]
[354] ./stuff/s1.js 31 bytes {121} {547} {568} {789} [built]
[707] ./stuff/s7.js 31 bytes {121} {356} [built]
+ 4 hidden chunk modules
chunk {178} pageC.js (pageC) 199 bytes (javascript) 3.12 KiB (runtime) [entry] [rendered]
> ./pages/c pageC
[33] ./stuff/s4.js 31 bytes {178} {424} [built]
[178] ./stuff/s5.js 31 bytes {178} [built]
[324] ./pages/c.js 106 bytes {178} [built]
[377] ./stuff/s6.js 31 bytes {178} [built]
+ 4 hidden chunk modules
chunk {356} pageE.js (pageE) 93 bytes (javascript) 3.12 KiB (runtime) [entry] [rendered]
> ./pages/e pageE
[238] ./pages/e.js 62 bytes {356} [built]
[707] ./stuff/s7.js 31 bytes {121} {356} [built]
+ 4 hidden chunk modules
chunk {402} 402.js 43 bytes [initial] [rendered] split chunk (cache group: defaultVendors)
> ./pages/c pageC
[402] ./node_modules/m5.js 43 bytes {402} [built]
chunk {424} pageA.js (pageA) 137 bytes (javascript) 3.13 KiB (runtime) [entry] [rendered]
> ./pages/a pageA
[33] ./stuff/s4.js 31 bytes {178} {424} [built]
[473] ./pages/a.js 106 bytes {424} [built]
+ 4 hidden chunk modules
chunk {497} 497.js 43 bytes [initial] [rendered] split chunk (cache group: defaultVendors)
> ./pages/b pageB
[497] ./node_modules/m4.js 43 bytes {497} [built]
chunk {505} 505.js 62 bytes [initial] [rendered] split chunk (cache group: default)
> ./pages/a pageA
> ./pages/d pageD
> ./pages/f pageF
[584] ./stuff/s3.js 31 bytes {505} [built]
[742] ./stuff/s2.js 31 bytes {505} [built]
chunk {547} pageG.js (pageG) 67 bytes (javascript) 3.12 KiB (runtime) [entry] [rendered]
> ./pages/g pageG
[354] ./stuff/s1.js 31 bytes {121} {547} {568} {789} [built]
[677] ./pages/g.js 36 bytes {547} [built]
+ 4 hidden chunk modules
chunk {568} pageD.js (pageD) 137 bytes (javascript) 3.13 KiB (runtime) [entry] [rendered]
> ./pages/d pageD
[354] ./stuff/s1.js 31 bytes {121} {547} {568} {789} [built]
[901] ./pages/d.js 106 bytes {568} [built]
+ 4 hidden chunk modules
chunk {730} 730.js 43 bytes [initial] [rendered] split chunk (cache group: defaultVendors)
> ./pages/a pageA
[730] ./node_modules/m3.js 43 bytes {730} [built]
chunk {777} 777.js 43 bytes [initial] [rendered] split chunk (cache group: defaultVendors)
> ./pages/d pageD
> ./pages/e pageE
> ./pages/f pageF
> ./pages/g pageG
[1] ./node_modules/m6.js 43 bytes {1} [built]
chunk {42} pageC.js (pageC) 199 bytes (javascript) 3.12 KiB (runtime) [entry] [rendered]
> ./pages/c pageC
[161] ./pages/c.js 106 bytes {42} [built]
[319] ./stuff/s6.js 31 bytes {42} [built]
[439] ./stuff/s5.js 31 bytes {42} [built]
[925] ./stuff/s4.js 31 bytes {42} {641} [built]
+ 4 hidden chunk modules
chunk {109} 109.js 43 bytes [initial] [rendered] split chunk (cache group: defaultVendors)
> ./pages/b pageB
[109] ./node_modules/m4.js 43 bytes {109} [built]
chunk {177} 177.js 43 bytes [initial] [rendered] split chunk (cache group: defaultVendors)
> ./pages/c pageC
[177] ./node_modules/m5.js 43 bytes {177} [built]
chunk {238} pageE.js (pageE) 93 bytes (javascript) 3.12 KiB (runtime) [entry] [rendered]
> ./pages/e pageE
[183] ./stuff/s7.js 31 bytes {238} {791} [built]
[960] ./pages/e.js 62 bytes {238} [built]
+ 4 hidden chunk modules
chunk {261} 261.js 62 bytes [initial] [rendered] split chunk (cache group: default)
> ./pages/a pageA
> ./pages/d pageD
[777] ./node_modules/m6.js 43 bytes {777} [built]
chunk {789} pageF.js (pageF) 137 bytes (javascript) 3.13 KiB (runtime) [entry] [rendered]
> ./pages/f pageF
[213] ./stuff/s3.js 31 bytes {261} [built]
[856] ./stuff/s2.js 31 bytes {261} [built]
chunk {589} 589.js 86 bytes [initial] [rendered] split chunk (cache group: defaultVendors)
> ./pages/a pageA
> ./pages/b pageB
> ./pages/c pageC
[594] ./node_modules/m1.js 43 bytes {589} [built]
[641] ./node_modules/m2.js 43 bytes {589} [built]
chunk {636} pageF.js (pageF) 137 bytes (javascript) 3.13 KiB (runtime) [entry] [rendered]
> ./pages/f pageF
[942] ./pages/f.js 106 bytes {636} [built]
[952] ./stuff/s1.js 31 bytes {636} {728} {791} {829} [built]
[247] ./pages/f.js 106 bytes {789} [built]
[354] ./stuff/s1.js 31 bytes {121} {547} {568} {789} [built]
+ 4 hidden chunk modules
chunk {641} pageA.js (pageA) 137 bytes (javascript) 3.13 KiB (runtime) [entry] [rendered]
> ./pages/a pageA
[303] ./pages/a.js 106 bytes {641} [built]
[925] ./stuff/s4.js 31 bytes {42} {641} [built]
+ 4 hidden chunk modules
chunk {650} 650.js 86 bytes [initial] [rendered] split chunk (cache group: defaultVendors)
chunk {833} 833.js 86 bytes [initial] [rendered] split chunk (cache group: defaultVendors)
> ./pages/d pageD
> ./pages/e pageE
> ./pages/f pageF
[15] ./node_modules/m8.js 43 bytes {650} [built]
[690] ./node_modules/m7.js 43 bytes {650} [built]
chunk {728} pageD.js (pageD) 137 bytes (javascript) 3.13 KiB (runtime) [entry] [rendered]
> ./pages/d pageD
[148] ./pages/d.js 106 bytes {728} [built]
[952] ./stuff/s1.js 31 bytes {636} {728} {791} {829} [built]
+ 4 hidden chunk modules
chunk {791} pageB.js (pageB) 199 bytes (javascript) 3.12 KiB (runtime) [entry] [rendered]
> ./pages/b pageB
[183] ./stuff/s7.js 31 bytes {238} {791} [built]
[772] ./stuff/s8.js 31 bytes {791} [built]
[952] ./stuff/s1.js 31 bytes {636} {728} {791} {829} [built]
[989] ./pages/b.js 106 bytes {791} [built]
+ 4 hidden chunk modules
chunk {792} 792.js 43 bytes [initial] [rendered] split chunk (cache group: defaultVendors)
> ./pages/a pageA
[792] ./node_modules/m3.js 43 bytes {792} [built]
chunk {829} pageG.js (pageG) 67 bytes (javascript) 3.12 KiB (runtime) [entry] [rendered]
> ./pages/g pageG
[292] ./pages/g.js 36 bytes {829} [built]
[952] ./stuff/s1.js 31 bytes {636} {728} {791} {829} [built]
+ 4 hidden chunk modules
```
[502] ./node_modules/m7.js 43 bytes {833} [built]
[848] ./node_modules/m8.js 43 bytes {833} [built]
```

View File

@ -6,15 +6,15 @@ This example application contains 7 pages, each of them importing 1-3 modules fr
The following configuration is used:
* `optimization.splitChunks.chunks: "all"` - This opt-in into automatic splitting of initial chunks which is off by default
* `optimization.splitChunks.maxInitial/AsyncRequests: 20` - This opt-in into a HTTP2 optimized splitting mode by increasing the allowed amount of requests. Browser only supports 6 requests in parallel for HTTP1.1.
- `optimization.splitChunks.chunks: "all"` - This opt-in into automatic splitting of initial chunks which is off by default
- `optimization.splitChunks.maxInitial/AsyncRequests: 20` - This opt-in into a HTTP2 optimized splitting mode by increasing the allowed amount of requests. Browser only supports 6 requests in parallel for HTTP1.1.
# Interpreting the result
* `pageA.js` the normal output files for the entrypoint `pageA`
* `vendors~pageD~pageE~pageF~pageG.js` vendor libs shared by these pages extracted into a separate output file when larger then the threshold in size
* `vendors~pageA.js` vendors only used by a single page but larger than the threshold in size
* `pageA~pageD~pageF.js` application modules shared by these pages and larger than the threshold in size
- `pageA.js` the normal output files for the entrypoint `pageA`
- `vendors~pageD~pageE~pageF~pageG.js` vendor libs shared by these pages extracted into a separate output file when larger then the threshold in size
- `vendors~pageA.js` vendors only used by a single page but larger than the threshold in size
- `pageA~pageD~pageF.js` application modules shared by these pages and larger than the threshold in size
The threshold is here 40 bytes, but by default (in a real application) 30kb.
@ -25,11 +25,11 @@ Note: decreasing `maxInitial/AsyncRequest` will increase duplication further to
## webpack.config.js
```
{{webpack.config.js}}
_{{webpack.config.js}}_
```
## Production mode
```
{{production:stdout}}
```
_{{production:stdout}}_
```

View File

@ -4,7 +4,7 @@ You see that everything is working nicely together.
# example.js
``` javascript
```javascript
// CommonJs-style requires
var commonjs1 = require("./commonjs");
var amd1 = require("./amd");
@ -23,7 +23,7 @@ require([
# amd.js
``` javascript
```javascript
// AMD Module Format
define(
"app/amd", // anonym is also supported
@ -40,7 +40,7 @@ define(
# commonjs.js
``` javascript
```javascript
// CommonJs Module Format
module.exports = 123;
@ -58,7 +58,7 @@ require(
<details><summary><code>/******/ (function(modules) { /* webpackBootstrap */ })</code></summary>
``` javascript
```javascript
/******/ (function(modules, runtime) { // webpackBootstrap
/******/ "use strict";
/******/ // The module cache
@ -108,7 +108,7 @@ require(
</details>
``` javascript
```javascript
/******/ ([
/* 0 */
/*!********************!*\
@ -124,7 +124,7 @@ var amd1 = __webpack_require__(/*! ./amd */ 2);
var harmony1 = __webpack_require__(/*! ./harmony */ 3);
// AMD-style requires (with all webpack features)
__webpack_require__.e(/*! AMD require */ 462).then(function() { var __WEBPACK_AMD_REQUIRE_ARRAY__ = [
__webpack_require__.e(/*! AMD require */ 635).then(function() { var __WEBPACK_AMD_REQUIRE_ARRAY__ = [
__webpack_require__(/*! ./commonjs */ 1), __webpack_require__(/*! ./amd */ 2),
__webpack_require__(4)("./"+amd1+".js"),
Math.random() < 0.5 ? __webpack_require__(/*! ./commonjs */ 1) : __webpack_require__(/*! ./amd */ 2)]; (function(commonjs2, amd2, template, randModule) {
@ -253,8 +253,7 @@ __webpack_require__.r(__webpack_exports__);
/******/
/******/ /* webpack/runtime/get javascript chunk filename */
/******/ !function() {
/******/
/******/ // This function only allows to reference on-demand chunks
/******/ // This function allow to reference async chunks
/******/ __webpack_require__.u = function(chunkId) {
/******/ // return url for filenames based on template
/******/ return "" + chunkId + ".output.js";
@ -269,7 +268,7 @@ __webpack_require__.r(__webpack_exports__);
/******/ // undefined = chunk not loaded, null = chunk preloaded/prefetched
/******/ // Promise = chunk loading, 0 = chunk loaded
/******/ var installedChunks = {
/******/ 404: 0
/******/ 179: 0
/******/ };
/******/
/******/
@ -382,10 +381,10 @@ __webpack_require__.r(__webpack_exports__);
</details>
# dist/462.output.js
# dist/635.output.js
``` javascript
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[462],[
```javascript
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[635],[
/* 0 */,
/* 1 */,
/* 2 */,
@ -410,13 +409,12 @@ function webpackContext(req) {
return __webpack_require__(id);
}
function webpackContextResolve(req) {
var id = map[req];
if(!(id + 1)) { // check for number or string
if(!Object.prototype.hasOwnProperty.call(map, req)) {
var e = new Error("Cannot find module '" + req + "'");
e.code = 'MODULE_NOT_FOUND';
throw e;
}
return id;
return map[req];
}
webpackContext.keys = function webpackContextKeys() {
return Object.keys(map);
@ -474,17 +472,17 @@ module.exports = function() {
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
462.output.js 2.14 KiB {462} [emitted]
output.js 12.1 KiB {404} [emitted] main
635.output.js 2.14 KiB {635} [emitted]
output.js 12.1 KiB {179} [emitted] main
Entrypoint main = output.js
chunk {404} output.js (main) 1010 bytes (javascript) 4.52 KiB (runtime) [entry] [rendered]
chunk {179} output.js (main) 1010 bytes (javascript) 4.51 KiB (runtime) [entry] [rendered]
> ./example.js main
[0] ./example.js 396 bytes {404} [built]
[0] ./example.js 396 bytes {179} [built]
[used exports unknown]
entry ./example.js main
[1] ./commonjs.js 223 bytes {404} [built]
[1] ./commonjs.js 223 bytes {179} [built]
[used exports unknown]
cjs require ./commonjs [0] ./example.js 2:16-37
amd require ./commonjs [0] ./example.js 7:0-14:1
@ -492,7 +490,7 @@ chunk {404} output.js (main) 1010 bytes (javascript) 4.52 KiB (runtime) [entry]
amd require ./commonjs [2] ./amd.js 2:0-12:1
cjs require ./commonjs [2] ./amd.js 7:18-39
harmony side effect evaluation ./commonjs [3] ./harmony.js 2:0-34
[2] ./amd.js 298 bytes {404} [built]
[2] ./amd.js 298 bytes {179} [built]
[used exports unknown]
cjs require ./amd [0] ./example.js 3:11-27
amd require ./amd [0] ./example.js 7:0-14:1
@ -500,7 +498,7 @@ chunk {404} output.js (main) 1010 bytes (javascript) 4.52 KiB (runtime) [entry]
amd require ./amd [1] ./commonjs.js 5:0-11:1
cjs require ./amd [1] ./commonjs.js 8:13-29
harmony side effect evaluation ./amd [3] ./harmony.js 3:0-24
[3] ./harmony.js 96 bytes {404} [built]
[3] ./harmony.js 96 bytes {179} [built]
[exports: default]
[used exports unknown]
cjs require ./harmony [0] ./example.js 4:15-35
@ -509,18 +507,18 @@ chunk {404} output.js (main) 1010 bytes (javascript) 4.52 KiB (runtime) [entry]
amd require ./harmony [2] ./amd.js 2:0-12:1
cjs require ./harmony [2] ./amd.js 8:17-37
+ 7 hidden chunk modules
chunk {462} 462.output.js 433 bytes [rendered]
chunk {635} 635.output.js 433 bytes [rendered]
> [0] ./example.js 7:0-14:1
[4] ../require.context/templates sync ^\.\/.*\.js$ 193 bytes {462} [built]
[4] ../require.context/templates sync ^\.\/.*\.js$ 193 bytes {635} [built]
[used exports unknown]
amd require context ../require.context/templates [0] ./example.js 7:0-14:1
[5] ../require.context/templates/a.js 80 bytes {462} [optional] [built]
[5] ../require.context/templates/a.js 80 bytes {635} [optional] [built]
[used exports unknown]
context element ./a.js [4] ../require.context/templates sync ^\.\/.*\.js$ ./a.js
[6] ../require.context/templates/b.js 80 bytes {462} [optional] [built]
[6] ../require.context/templates/b.js 80 bytes {635} [optional] [built]
[used exports unknown]
context element ./b.js [4] ../require.context/templates sync ^\.\/.*\.js$ ./b.js
[7] ../require.context/templates/c.js 80 bytes {462} [optional] [built]
[7] ../require.context/templates/c.js 80 bytes {635} [optional] [built]
[used exports unknown]
context element ./c.js [4] ../require.context/templates sync ^\.\/.*\.js$ ./c.js
```
@ -529,45 +527,45 @@ chunk {462} 462.output.js 433 bytes [rendered]
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
462.output.js 621 bytes {462} [emitted]
output.js 2.24 KiB {404} [emitted] main
635.output.js 647 bytes {635} [emitted]
output.js 2.24 KiB {179} [emitted] main
Entrypoint main = output.js
chunk {404} output.js (main) 1010 bytes (javascript) 4.52 KiB (runtime) [entry] [rendered]
chunk {179} output.js (main) 1010 bytes (javascript) 4.51 KiB (runtime) [entry] [rendered]
> ./example.js main
[38] ./commonjs.js 223 bytes {404} [built]
cjs require ./commonjs [275] ./example.js 2:16-37
amd require ./commonjs [275] ./example.js 7:0-14:1
amd require ./commonjs [275] ./example.js 7:0-14:1
harmony side effect evaluation ./commonjs [325] ./harmony.js 2:0-34
amd require ./commonjs [970] ./amd.js 2:0-12:1
cjs require ./commonjs [970] ./amd.js 7:18-39
[275] ./example.js 396 bytes {404} [built]
[144] ./example.js 396 bytes {179} [built]
entry ./example.js main
[325] ./harmony.js 96 bytes {404} [built]
[186] ./commonjs.js 223 bytes {179} [built]
cjs require ./commonjs [144] ./example.js 2:16-37
amd require ./commonjs [144] ./example.js 7:0-14:1
amd require ./commonjs [144] ./example.js 7:0-14:1
harmony side effect evaluation ./commonjs [356] ./harmony.js 2:0-34
amd require ./commonjs [685] ./amd.js 2:0-12:1
cjs require ./commonjs [685] ./amd.js 7:18-39
[356] ./harmony.js 96 bytes {179} [built]
[exports: default]
amd require ./harmony [38] ./commonjs.js 5:0-11:1
cjs require ./harmony [38] ./commonjs.js 9:17-37
cjs require ./harmony [275] ./example.js 4:15-35
amd require ./harmony [970] ./amd.js 2:0-12:1
cjs require ./harmony [970] ./amd.js 8:17-37
[970] ./amd.js 298 bytes {404} [built]
amd require ./amd [38] ./commonjs.js 5:0-11:1
cjs require ./amd [38] ./commonjs.js 8:13-29
cjs require ./amd [275] ./example.js 3:11-27
amd require ./amd [275] ./example.js 7:0-14:1
amd require ./amd [275] ./example.js 7:0-14:1
harmony side effect evaluation ./amd [325] ./harmony.js 3:0-24
cjs require ./harmony [144] ./example.js 4:15-35
amd require ./harmony [186] ./commonjs.js 5:0-11:1
cjs require ./harmony [186] ./commonjs.js 9:17-37
amd require ./harmony [685] ./amd.js 2:0-12:1
cjs require ./harmony [685] ./amd.js 8:17-37
[685] ./amd.js 298 bytes {179} [built]
cjs require ./amd [144] ./example.js 3:11-27
amd require ./amd [144] ./example.js 7:0-14:1
amd require ./amd [144] ./example.js 7:0-14:1
amd require ./amd [186] ./commonjs.js 5:0-11:1
cjs require ./amd [186] ./commonjs.js 8:13-29
harmony side effect evaluation ./amd [356] ./harmony.js 3:0-24
+ 7 hidden chunk modules
chunk {462} 462.output.js 433 bytes [rendered]
> [275] ./example.js 7:0-14:1
[145] ../require.context/templates/a.js 80 bytes {462} [optional] [built]
context element ./a.js [462] ../require.context/templates sync ^\.\/.*\.js$ ./a.js
[221] ../require.context/templates/c.js 80 bytes {462} [optional] [built]
context element ./c.js [462] ../require.context/templates sync ^\.\/.*\.js$ ./c.js
[462] ../require.context/templates sync ^\.\/.*\.js$ 193 bytes {462} [built]
amd require context ../require.context/templates [275] ./example.js 7:0-14:1
[641] ../require.context/templates/b.js 80 bytes {462} [optional] [built]
context element ./b.js [462] ../require.context/templates sync ^\.\/.*\.js$ ./b.js
chunk {635} 635.output.js 433 bytes [rendered]
> [144] ./example.js 7:0-14:1
[34] ../require.context/templates/a.js 80 bytes {635} [optional] [built]
context element ./a.js [635] ../require.context/templates sync ^\.\/.*\.js$ ./a.js
[413] ../require.context/templates/c.js 80 bytes {635} [optional] [built]
context element ./c.js [635] ../require.context/templates sync ^\.\/.*\.js$ ./c.js
[631] ../require.context/templates/b.js 80 bytes {635} [optional] [built]
context element ./b.js [635] ../require.context/templates sync ^\.\/.*\.js$ ./b.js
[635] ../require.context/templates sync ^\.\/.*\.js$ 193 bytes {635} [built]
amd require context ../require.context/templates [144] ./example.js 7:0-14:1
```

View File

@ -4,32 +4,32 @@ You see that everything is working nicely together.
# example.js
``` javascript
{{example.js}}
```javascript
_{{example.js}}_
```
# amd.js
``` javascript
{{amd.js}}
```javascript
_{{amd.js}}_
```
# commonjs.js
``` javascript
{{commonjs.js}}
```javascript
_{{commonjs.js}}_
```
# dist/output.js
``` javascript
{{dist/output.js}}
```javascript
_{{dist/output.js}}_
```
# dist/462.output.js
# dist/635.output.js
``` javascript
{{dist/462.output.js}}
```javascript
_{{dist/635.output.js}}_
```
# Info
@ -37,11 +37,11 @@ You see that everything is working nicely together.
## Unoptimized
```
{{stdout}}
_{{stdout}}_
```
## Production mode
```
{{production:stdout}}
_{{production:stdout}}_
```

View File

@ -1,7 +1,6 @@
# example.js
``` javascript
```javascript
if(ENV === "mobile") {
require("./mobile-stuff");
}
@ -10,7 +9,7 @@ console.log("Running " + ENV + " build");
# webpack.config.js
``` javascript
```javascript
var path = require("path");
var webpack = require("../../");
module.exports = [
@ -50,7 +49,7 @@ module.exports = [
<details><summary><code>/******/ (function(modules) { /* webpackBootstrap */ })</code></summary>
``` javascript
```javascript
/******/ (function(modules, runtime) { // webpackBootstrap
/******/ "use strict";
/******/ // The module cache
@ -96,7 +95,7 @@ module.exports = [
</details>
``` javascript
```javascript
/******/ ([
/* 0 */
/*!********************!*\
@ -115,7 +114,7 @@ console.log("Running " + "desktop" + " build");
# dist/mobile.js
``` javascript
```javascript
/******/ (function(modules, runtime) { // webpackBootstrap
/******/ "use strict";
/******/ // The module cache
@ -192,7 +191,7 @@ console.log("Running " + "mobile" + " build");
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Child mobile:
Hash: 0a1b2c3d4e5f6a7b8c9d
Asset Size Chunks Chunk Names
@ -222,25 +221,25 @@ Child desktop:
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Child mobile:
Hash: 0a1b2c3d4e5f6a7b8c9d
Asset Size Chunks Chunk Names
mobile.js 263 bytes {404} [emitted] main
mobile.js 263 bytes {179} [emitted] main
Entrypoint main = mobile.js
chunk {404} mobile.js (main) 114 bytes [entry] [rendered]
chunk {179} mobile.js (main) 114 bytes [entry] [rendered]
> ./example main
[273] ./mobile-stuff.js 20 bytes {404} [built]
cjs require ./mobile-stuff [275] ./example.js 2:1-26
[275] ./example.js 94 bytes {404} [built]
[144] ./example.js 94 bytes {179} [built]
entry ./example main
[791] ./mobile-stuff.js 20 bytes {179} [built]
cjs require ./mobile-stuff [144] ./example.js 2:1-26
Child desktop:
Hash: 0a1b2c3d4e5f6a7b8c9d
Asset Size Chunks Chunk Names
desktop.js 235 bytes {404} [emitted] main
desktop.js 235 bytes {179} [emitted] main
Entrypoint main = desktop.js
chunk {404} desktop.js (main) 94 bytes [entry] [rendered]
chunk {179} desktop.js (main) 94 bytes [entry] [rendered]
> ./example main
[275] ./example.js 94 bytes {404} [built]
[144] ./example.js 94 bytes {179} [built]
entry ./example main
```
```

View File

@ -1,26 +1,25 @@
# example.js
``` javascript
{{example.js}}
```javascript
_{{example.js}}_
```
# webpack.config.js
``` javascript
{{webpack.config.js}}
```javascript
_{{webpack.config.js}}_
```
# dist/desktop.js
``` javascript
{{dist/desktop.js}}
```javascript
_{{dist/desktop.js}}_
```
# dist/mobile.js
``` javascript
{{dist/mobile.js}}
```javascript
_{{dist/mobile.js}}_
```
# Info
@ -28,11 +27,11 @@
## Unoptimized
```
{{stdout}}
_{{stdout}}_
```
## Production mode
```
{{production:stdout}}
```
_{{production:stdout}}_
```

View File

@ -14,7 +14,7 @@ Note: When your library has dependencies that should not be included in the comp
# webpack.config.js
``` javascript
```javascript
var path = require("path");
module.exports = {
// mode: "development || "production",
@ -33,7 +33,7 @@ module.exports = {
# dist/MyLibrary.alpha.js
``` javascript
```javascript
(function webpackUniversalModuleDefinition(root, factory) {
if(typeof exports === 'object' && typeof module === 'object')
module.exports = factory();
@ -112,7 +112,7 @@ module.exports = "alpha";
# dist/MyLibrary.beta.js
``` javascript
```javascript
(function webpackUniversalModuleDefinition(root, factory) {
if(typeof exports === 'object' && typeof module === 'object')
module.exports = factory();
@ -187,7 +187,7 @@ module.exports = "beta";
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
MyLibrary.alpha.js 1.94 KiB {0} [emitted] alpha
MyLibrary.beta.js 1.94 KiB {1} [emitted] beta
@ -209,18 +209,18 @@ chunk {1} MyLibrary.beta.js (beta) 24 bytes [entry] [rendered]
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
MyLibrary.alpha.js 481 bytes {963} [emitted] alpha
MyLibrary.beta.js 478 bytes {188} [emitted] beta
MyLibrary.alpha.js 481 bytes {487} [emitted] alpha
MyLibrary.beta.js 476 bytes {904} [emitted] beta
Entrypoint alpha = MyLibrary.alpha.js
Entrypoint beta = MyLibrary.beta.js
chunk {188} MyLibrary.beta.js (beta) 24 bytes [entry] [rendered]
> ./beta beta
[145] ./beta.js 24 bytes {188} [built]
entry ./beta beta
chunk {963} MyLibrary.alpha.js (alpha) 25 bytes [entry] [rendered]
chunk {487} MyLibrary.alpha.js (alpha) 25 bytes [entry] [rendered]
> ./alpha alpha
[930] ./alpha.js 25 bytes {963} [built]
[758] ./alpha.js 25 bytes {487} [built]
entry ./alpha alpha
chunk {904} MyLibrary.beta.js (beta) 24 bytes [entry] [rendered]
> ./beta beta
[97] ./beta.js 24 bytes {904} [built]
entry ./beta beta
```

View File

@ -14,20 +14,20 @@ Note: When your library has dependencies that should not be included in the comp
# webpack.config.js
``` javascript
{{webpack.config.js}}
```javascript
_{{webpack.config.js}}_
```
# dist/MyLibrary.alpha.js
``` javascript
{{dist/MyLibrary.alpha.js}}
```javascript
_{{dist/MyLibrary.alpha.js}}_
```
# dist/MyLibrary.beta.js
``` javascript
{{dist/MyLibrary.beta.js}}
```javascript
_{{dist/MyLibrary.beta.js}}_
```
# Info
@ -35,11 +35,11 @@ Note: When your library has dependencies that should not be included in the comp
## Unoptimized
```
{{stdout}}
_{{stdout}}_
```
## Production mode
```
{{production:stdout}}
_{{production:stdout}}_
```

View File

@ -8,29 +8,29 @@ You can use
You can see the output files:
* `commons.js` contains:
* module `common.js` which is used in both pages
* `pageA.js` contains: (`pageB.js` is similar)
* the module system
* chunk loading logic
* the entry point `pageA.js`
* it would contain any other module that is only used by `pageA`
* `1.js` is an additional chunk which is used by both pages. It contains:
* module `shared.js`
- `commons.js` contains:
- module `common.js` which is used in both pages
- `pageA.js` contains: (`pageB.js` is similar)
- the module system
- chunk loading logic
- the entry point `pageA.js`
- it would contain any other module that is only used by `pageA`
- `406.js` is an additional chunk which is used by both pages. It contains:
- module `shared.js`
You can also see the info that is printed to console. It shows among others:
* the generated files
* the chunks with file, name and id
* see lines starting with `chunk`
* the modules that are in the chunks
* the reasons why the modules are included
* the reasons why a chunk is created
* see lines starting with `>`
- the generated files
- the chunks with file, name and id
- see lines starting with `chunk`
- the modules that are in the chunks
- the reasons why the modules are included
- the reasons why a chunk is created
- see lines starting with `>`
# pageA.js
``` javascript
```javascript
var common = require("./common");
require(["./shared"], function(shared) {
shared("This is page A");
@ -39,7 +39,7 @@ require(["./shared"], function(shared) {
# pageB.js
``` javascript
```javascript
var common = require("./common");
require.ensure(["./shared"], function(require) {
var shared = require("./shared");
@ -49,7 +49,7 @@ require.ensure(["./shared"], function(require) {
# webpack.config.js
``` javascript
```javascript
module.exports = {
// mode: "development || "production",
entry: {
@ -74,7 +74,7 @@ module.exports = {
# pageA.html
``` html
```html
<html>
<head></head>
<body>
@ -86,8 +86,8 @@ module.exports = {
# dist/commons.js
``` javascript
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[987],[
```javascript
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[351],[
/* 0 */,
/* 1 */
/*!*******************!*\
@ -107,7 +107,7 @@ module.exports = "Common";
<details><summary><code>/******/ (function(modules) { /* webpackBootstrap */ })</code></summary>
``` javascript
```javascript
/******/ (function(modules, runtime) { // webpackBootstrap
/******/ "use strict";
/******/ // The module cache
@ -153,7 +153,7 @@ module.exports = "Common";
</details>
``` javascript
```javascript
/******/ ([
/* 0 */
/*!******************!*\
@ -164,7 +164,7 @@ module.exports = "Common";
/***/ (function(__unusedmodule, __unusedexports, __webpack_require__) {
var common = __webpack_require__(/*! ./common */ 1);
__webpack_require__.e(/*! AMD require */ 406).then(function() { var __WEBPACK_AMD_REQUIRE_ARRAY__ = [__webpack_require__(/*! ./shared */ 3)]; (function(shared) {
__webpack_require__.e(/*! AMD require */ 52).then(function() { var __WEBPACK_AMD_REQUIRE_ARRAY__ = [__webpack_require__(/*! ./shared */ 3)]; (function(shared) {
shared("This is page A");
}).apply(null, __WEBPACK_AMD_REQUIRE_ARRAY__);}).catch(__webpack_require__.oe);
@ -195,8 +195,7 @@ __webpack_require__.e(/*! AMD require */ 406).then(function() { var __WEBPACK_AM
/******/
/******/ /* webpack/runtime/get javascript chunk filename */
/******/ !function() {
/******/
/******/ // This function only allows to reference on-demand chunks
/******/ // This function allow to reference async chunks
/******/ __webpack_require__.u = function(chunkId) {
/******/ // return url for filenames based on template
/******/ return "" + chunkId + ".js";
@ -211,11 +210,11 @@ __webpack_require__.e(/*! AMD require */ 406).then(function() { var __WEBPACK_AM
/******/ // undefined = chunk not loaded, null = chunk preloaded/prefetched
/******/ // Promise = chunk loading, 0 = chunk loaded
/******/ var installedChunks = {
/******/ 641: 0
/******/ 424: 0
/******/ };
/******/
/******/ var deferredModules = [
/******/ [0,987]
/******/ [0,351]
/******/ ];
/******/
/******/ __webpack_require__.f.j = function(chunkId, promises) {
@ -353,7 +352,7 @@ __webpack_require__.e(/*! AMD require */ 406).then(function() { var __WEBPACK_AM
# dist/pageB.js
``` javascript
```javascript
/******/ (function(modules, runtime) { // webpackBootstrap
/******/ "use strict";
/******/ // The module cache
@ -406,7 +405,7 @@ __webpack_require__.e(/*! AMD require */ 406).then(function() { var __WEBPACK_AM
/***/ (function(__unusedmodule, __unusedexports, __webpack_require__) {
var common = __webpack_require__(/*! ./common */ 1);
__webpack_require__.e(/*! require.ensure */ 406).then((function(require) {
__webpack_require__.e(/*! require.ensure */ 52).then((function(require) {
var shared = __webpack_require__(/*! ./shared */ 3);
shared("This is page B");
}).bind(null, __webpack_require__)).catch(__webpack_require__.oe);
@ -434,8 +433,7 @@ __webpack_require__.e(/*! require.ensure */ 406).then((function(require) {
/******/
/******/ /* webpack/runtime/get javascript chunk filename */
/******/ !function() {
/******/
/******/ // This function only allows to reference on-demand chunks
/******/ // This function allow to reference async chunks
/******/ __webpack_require__.u = function(chunkId) {
/******/ // return url for filenames based on template
/******/ return "" + chunkId + ".js";
@ -450,11 +448,11 @@ __webpack_require__.e(/*! require.ensure */ 406).then((function(require) {
/******/ // undefined = chunk not loaded, null = chunk preloaded/prefetched
/******/ // Promise = chunk loading, 0 = chunk loaded
/******/ var installedChunks = {
/******/ 791: 0
/******/ 121: 0
/******/ };
/******/
/******/ var deferredModules = [
/******/ [2,987]
/******/ [2,351]
/******/ ];
/******/
/******/ __webpack_require__.f.j = function(chunkId, promises) {
@ -587,10 +585,10 @@ __webpack_require__.e(/*! require.ensure */ 406).then((function(require) {
);
```
# dist/406.js
# dist/52.js
``` javascript
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[406],{
```javascript
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[52],{
/***/ 3:
/*!*******************!*\
@ -616,78 +614,78 @@ module.exports = function(msg) {
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
406.js 471 bytes {406} [emitted]
commons.js 337 bytes {987} [emitted] commons
pageA.js 8.66 KiB {641} [emitted] pageA
pageB.js 8.6 KiB {791} [emitted] pageB
52.js 470 bytes {52} [emitted]
commons.js 337 bytes {351} [emitted] commons
pageA.js 8.64 KiB {424} [emitted] pageA
pageB.js 8.58 KiB {121} [emitted] pageB
Entrypoint pageA = commons.js pageA.js
Entrypoint pageB = commons.js pageB.js
chunk {406} 406.js 88 bytes [rendered]
chunk {52} 52.js 88 bytes [rendered]
> ./shared [0] ./pageA.js 2:0-4:2
> [2] ./pageB.js 2:0-5:2
[3] ./shared.js 88 bytes {406} [built]
[3] ./shared.js 88 bytes {52} [built]
[used exports unknown]
amd require ./shared [0] ./pageA.js 2:0-4:2
require.ensure item ./shared [2] ./pageB.js 2:0-5:2
cjs require ./shared [2] ./pageB.js 3:14-33
chunk {641} pageA.js (pageA) 105 bytes (javascript) 4.61 KiB (runtime) [entry] [rendered]
> ./pageA pageA
[0] ./pageA.js 105 bytes {641} [built]
[used exports unknown]
entry ./pageA pageA
+ 4 hidden chunk modules
chunk {791} pageB.js (pageB) 148 bytes (javascript) 4.61 KiB (runtime) [entry] [rendered]
chunk {121} pageB.js (pageB) 148 bytes (javascript) 4.6 KiB (runtime) [entry] [rendered]
> ./pageB pageB
[2] ./pageB.js 148 bytes {791} [built]
[2] ./pageB.js 148 bytes {121} [built]
[used exports unknown]
entry ./pageB pageB
+ 4 hidden chunk modules
chunk {987} commons.js (commons) 26 bytes [initial] [rendered] split chunk (cache group: commons) (name: commons)
chunk {351} commons.js (commons) 26 bytes [initial] [rendered] split chunk (cache group: commons) (name: commons)
> ./pageA pageA
> ./pageB pageB
[1] ./common.js 26 bytes {987} [built]
[1] ./common.js 26 bytes {351} [built]
[used exports unknown]
cjs require ./common [0] ./pageA.js 1:13-32
cjs require ./common [2] ./pageB.js 1:13-32
cjs require ./common [3] ./shared.js 1:13-32
chunk {424} pageA.js (pageA) 105 bytes (javascript) 4.6 KiB (runtime) [entry] [rendered]
> ./pageA pageA
[0] ./pageA.js 105 bytes {424} [built]
[used exports unknown]
entry ./pageA pageA
+ 4 hidden chunk modules
```
## Production mode
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
406.js 128 bytes {406} [emitted]
commons.js 98 bytes {987} [emitted] commons
pageA.js 1.73 KiB {641} [emitted] pageA
pageB.js 1.71 KiB {791} [emitted] pageB
52.js 126 bytes {52} [emitted]
commons.js 98 bytes {351} [emitted] commons
pageA.js 1.73 KiB {424} [emitted] pageA
pageB.js 1.71 KiB {121} [emitted] pageB
Entrypoint pageA = commons.js pageA.js
Entrypoint pageB = commons.js pageB.js
chunk {406} 406.js 88 bytes [rendered]
> ./shared [953] ./pageA.js 2:0-4:2
> [954] ./pageB.js 2:0-5:2
[406] ./shared.js 88 bytes {406} [built]
amd require ./shared [953] ./pageA.js 2:0-4:2
require.ensure item ./shared [954] ./pageB.js 2:0-5:2
cjs require ./shared [954] ./pageB.js 3:14-33
chunk {641} pageA.js (pageA) 105 bytes (javascript) 4.61 KiB (runtime) [entry] [rendered]
> ./pageA pageA
[953] ./pageA.js 105 bytes {641} [built]
entry ./pageA pageA
+ 4 hidden chunk modules
chunk {791} pageB.js (pageB) 148 bytes (javascript) 4.61 KiB (runtime) [entry] [rendered]
chunk {52} 52.js 88 bytes [rendered]
> ./shared [366] ./pageA.js 2:0-4:2
> [588] ./pageB.js 2:0-5:2
[52] ./shared.js 88 bytes {52} [built]
amd require ./shared [366] ./pageA.js 2:0-4:2
require.ensure item ./shared [588] ./pageB.js 2:0-5:2
cjs require ./shared [588] ./pageB.js 3:14-33
chunk {121} pageB.js (pageB) 148 bytes (javascript) 4.6 KiB (runtime) [entry] [rendered]
> ./pageB pageB
[954] ./pageB.js 148 bytes {791} [built]
[588] ./pageB.js 148 bytes {121} [built]
entry ./pageB pageB
+ 4 hidden chunk modules
chunk {987} commons.js (commons) 26 bytes [initial] [rendered] split chunk (cache group: commons) (name: commons)
chunk {351} commons.js (commons) 26 bytes [initial] [rendered] split chunk (cache group: commons) (name: commons)
> ./pageA pageA
> ./pageB pageB
[280] ./common.js 26 bytes {987} [built]
cjs require ./common [406] ./shared.js 1:13-32
cjs require ./common [953] ./pageA.js 1:13-32
cjs require ./common [954] ./pageB.js 1:13-32
[543] ./common.js 26 bytes {351} [built]
cjs require ./common [52] ./shared.js 1:13-32
cjs require ./common [366] ./pageA.js 1:13-32
cjs require ./common [588] ./pageB.js 1:13-32
chunk {424} pageA.js (pageA) 105 bytes (javascript) 4.6 KiB (runtime) [entry] [rendered]
> ./pageA pageA
[366] ./pageA.js 105 bytes {424} [built]
entry ./pageA pageA
+ 4 hidden chunk modules
```

View File

@ -8,72 +8,72 @@ You can use
You can see the output files:
* `commons.js` contains:
* module `common.js` which is used in both pages
* `pageA.js` contains: (`pageB.js` is similar)
* the module system
* chunk loading logic
* the entry point `pageA.js`
* it would contain any other module that is only used by `pageA`
* `1.js` is an additional chunk which is used by both pages. It contains:
* module `shared.js`
- `commons.js` contains:
- module `common.js` which is used in both pages
- `pageA.js` contains: (`pageB.js` is similar)
- the module system
- chunk loading logic
- the entry point `pageA.js`
- it would contain any other module that is only used by `pageA`
- `406.js` is an additional chunk which is used by both pages. It contains:
- module `shared.js`
You can also see the info that is printed to console. It shows among others:
* the generated files
* the chunks with file, name and id
* see lines starting with `chunk`
* the modules that are in the chunks
* the reasons why the modules are included
* the reasons why a chunk is created
* see lines starting with `>`
- the generated files
- the chunks with file, name and id
- see lines starting with `chunk`
- the modules that are in the chunks
- the reasons why the modules are included
- the reasons why a chunk is created
- see lines starting with `>`
# pageA.js
``` javascript
{{pageA.js}}
```javascript
_{{pageA.js}}_
```
# pageB.js
``` javascript
{{pageB.js}}
```javascript
_{{pageB.js}}_
```
# webpack.config.js
``` javascript
{{webpack.config.js}}
```javascript
_{{webpack.config.js}}_
```
# pageA.html
``` html
{{pageA.html}}
```html
_{{pageA.html}}_
```
# dist/commons.js
``` javascript
{{dist/commons.js}}
```javascript
_{{dist/commons.js}}_
```
# dist/pageA.js
``` javascript
{{dist/pageA.js}}
```javascript
_{{dist/pageA.js}}_
```
# dist/pageB.js
``` javascript
{{dist/pageB.js}}
```javascript
_{{dist/pageB.js}}_
```
# dist/406.js
# dist/52.js
``` javascript
{{dist/406.js}}
```javascript
_{{dist/52.js}}_
```
# Info
@ -81,11 +81,11 @@ You can also see the info that is printed to console. It shows among others:
## Unoptimized
```
{{stdout}}
_{{stdout}}_
```
## Production mode
```
{{production:stdout}}
_{{production:stdout}}_
```

View File

@ -1,6 +1,6 @@
# example.js
``` javascript
```javascript
var a = require("a");
require.ensure(["b"], function(require) {
@ -23,12 +23,11 @@ require.ensure(["b"], function(require) {
});
```
# dist/output.js
<details><summary><code>/******/ (function(modules) { /* webpackBootstrap */ })</code></summary>
``` javascript
```javascript
/******/ (function(modules, runtime) { // webpackBootstrap
/******/ "use strict";
/******/ // The module cache
@ -78,7 +77,7 @@ require.ensure(["b"], function(require) {
</details>
``` javascript
```javascript
/******/ ([
/* 0 */
/*!********************!*\
@ -90,21 +89,21 @@ require.ensure(["b"], function(require) {
var a = __webpack_require__(/*! a */ 1);
__webpack_require__.e(/*! require.ensure | my own chunk */ 368).then((function(require) {
__webpack_require__.e(/*! require.ensure | my own chunk */ 666).then((function(require) {
// a named chunk
var c = __webpack_require__(/*! c */ 3);
}).bind(null, __webpack_require__)).catch(__webpack_require__.oe);
__webpack_require__.e(/*! require.ensure | my own chunk */ 368).then((function(require) {
__webpack_require__.e(/*! require.ensure | my own chunk */ 666).then((function(require) {
// another chunk with the same name
var d = __webpack_require__(/*! d */ 4);
}).bind(null, __webpack_require__)).catch(__webpack_require__.oe);
__webpack_require__.e(/*! require.ensure | my own chunk */ 368).then((function(require) {
__webpack_require__.e(/*! require.ensure | my own chunk */ 666).then((function(require) {
// the same again
}).bind(null, __webpack_require__)).catch(__webpack_require__.oe);
__webpack_require__.e(/*! require.ensure */ 126).then((function(require) {
__webpack_require__.e(/*! require.ensure */ 885).then((function(require) {
// chunk without name
var d = __webpack_require__(/*! d */ 4);
}).bind(null, __webpack_require__)).catch(__webpack_require__.oe);
@ -148,8 +147,7 @@ __webpack_require__.e(/*! require.ensure */ 126).then((function(require) {
/******/
/******/ /* webpack/runtime/get javascript chunk filename */
/******/ !function() {
/******/
/******/ // This function only allows to reference on-demand chunks
/******/ // This function allow to reference async chunks
/******/ __webpack_require__.u = function(chunkId) {
/******/ // return url for filenames based on template
/******/ return "" + chunkId + ".output.js";
@ -164,7 +162,7 @@ __webpack_require__.e(/*! require.ensure */ 126).then((function(require) {
/******/ // undefined = chunk not loaded, null = chunk preloaded/prefetched
/******/ // Promise = chunk loading, 0 = chunk loaded
/******/ var installedChunks = {
/******/ 404: 0
/******/ 179: 0
/******/ };
/******/
/******/
@ -277,42 +275,10 @@ __webpack_require__.e(/*! require.ensure */ 126).then((function(require) {
</details>
# dist/126.output.js
# dist/666.output.js
``` javascript
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[126],[
/* 0 */,
/* 1 */,
/* 2 */
/*!***************************!*\
!*** ./node_modules/b.js ***!
\***************************/
/*! other exports [maybe provided (runtime-defined)] [no usage info] */
/*! runtime requirements: */
/***/ (function() {
// module b
/***/ }),
/* 3 */,
/* 4 */
/*!***************************!*\
!*** ./node_modules/d.js ***!
\***************************/
/*! other exports [maybe provided (runtime-defined)] [no usage info] */
/*! runtime requirements: */
/***/ (function() {
// module d
/***/ })
]]);
```
# dist/368.output.js
``` javascript
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[368],[
```javascript
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[666],[
/* 0 */,
/* 1 */,
/* 2 */
@ -351,93 +317,125 @@ __webpack_require__.e(/*! require.ensure */ 126).then((function(require) {
]]);
```
# dist/885.output.js
```javascript
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[885],[
/* 0 */,
/* 1 */,
/* 2 */
/*!***************************!*\
!*** ./node_modules/b.js ***!
\***************************/
/*! other exports [maybe provided (runtime-defined)] [no usage info] */
/*! runtime requirements: */
/***/ (function() {
// module b
/***/ }),
/* 3 */,
/* 4 */
/*!***************************!*\
!*** ./node_modules/d.js ***!
\***************************/
/*! other exports [maybe provided (runtime-defined)] [no usage info] */
/*! runtime requirements: */
/***/ (function() {
// module d
/***/ })
]]);
```
# Info
## Unoptimized
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
126.output.js 604 bytes {126} [emitted]
368.output.js 847 bytes {368} [emitted] my own chunk
output.js 8.34 KiB {404} [emitted] main
666.output.js 847 bytes {666} [emitted] my own chunk
885.output.js 604 bytes {885} [emitted]
output.js 8.32 KiB {179} [emitted] main
Entrypoint main = output.js
chunk {126} 126.output.js 22 bytes [rendered]
> [0] ./example.js 17:0-20:2
[2] ./node_modules/b.js 11 bytes {126} {368} [built]
[used exports unknown]
require.ensure item b [0] ./example.js 3:0-6:18
require.ensure item b [0] ./example.js 8:0-11:18
require.ensure item b [0] ./example.js 17:0-20:2
[4] ./node_modules/d.js 11 bytes {126} {368} [built]
[used exports unknown]
cjs require d [0] ./example.js 10:9-21
cjs require d [0] ./example.js 19:9-21
chunk {368} 368.output.js (my own chunk) 33 bytes [rendered]
> [0] ./example.js 13:0-15:18
> [0] ./example.js 3:0-6:18
> [0] ./example.js 8:0-11:18
[2] ./node_modules/b.js 11 bytes {126} {368} [built]
[used exports unknown]
require.ensure item b [0] ./example.js 3:0-6:18
require.ensure item b [0] ./example.js 8:0-11:18
require.ensure item b [0] ./example.js 17:0-20:2
[3] ./node_modules/c.js 11 bytes {368} [built]
[used exports unknown]
cjs require c [0] ./example.js 5:9-21
[4] ./node_modules/d.js 11 bytes {126} {368} [built]
[used exports unknown]
cjs require d [0] ./example.js 10:9-21
cjs require d [0] ./example.js 19:9-21
chunk {404} output.js (main) 432 bytes (javascript) 3.65 KiB (runtime) [entry] [rendered]
chunk {179} output.js (main) 432 bytes (javascript) 3.64 KiB (runtime) [entry] [rendered]
> ./example.js main
[0] ./example.js 421 bytes {404} [built]
[0] ./example.js 421 bytes {179} [built]
[used exports unknown]
entry ./example.js main
[1] ./node_modules/a.js 11 bytes {404} [built]
[1] ./node_modules/a.js 11 bytes {179} [built]
[used exports unknown]
cjs require a [0] ./example.js 1:8-20
+ 4 hidden chunk modules
chunk {666} 666.output.js (my own chunk) 33 bytes [rendered]
> [0] ./example.js 13:0-15:18
> [0] ./example.js 3:0-6:18
> [0] ./example.js 8:0-11:18
[2] ./node_modules/b.js 11 bytes {666} {885} [built]
[used exports unknown]
require.ensure item b [0] ./example.js 3:0-6:18
require.ensure item b [0] ./example.js 8:0-11:18
require.ensure item b [0] ./example.js 17:0-20:2
[3] ./node_modules/c.js 11 bytes {666} [built]
[used exports unknown]
cjs require c [0] ./example.js 5:9-21
[4] ./node_modules/d.js 11 bytes {666} {885} [built]
[used exports unknown]
cjs require d [0] ./example.js 10:9-21
cjs require d [0] ./example.js 19:9-21
chunk {885} 885.output.js 22 bytes [rendered]
> [0] ./example.js 17:0-20:2
[2] ./node_modules/b.js 11 bytes {666} {885} [built]
[used exports unknown]
require.ensure item b [0] ./example.js 3:0-6:18
require.ensure item b [0] ./example.js 8:0-11:18
require.ensure item b [0] ./example.js 17:0-20:2
[4] ./node_modules/d.js 11 bytes {666} {885} [built]
[used exports unknown]
cjs require d [0] ./example.js 10:9-21
cjs require d [0] ./example.js 19:9-21
```
## Production mode
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
126.output.js 95 bytes {126} [emitted]
368.output.js 116 bytes {126}, {368} [emitted] my own chunk
output.js 1.58 KiB {404} [emitted] main
666.output.js 117 bytes {666}, {885} [emitted] my own chunk
885.output.js 96 bytes {885} [emitted]
output.js 1.59 KiB {179} [emitted] main
Entrypoint main = output.js
chunk {126} 126.output.js 22 bytes [rendered]
> [275] ./example.js 17:0-20:2
[33] ./node_modules/d.js 11 bytes {126} {368} [built]
cjs require d [275] ./example.js 10:9-21
cjs require d [275] ./example.js 19:9-21
[215] ./node_modules/b.js 11 bytes {126} {368} [built]
require.ensure item b [275] ./example.js 3:0-6:18
require.ensure item b [275] ./example.js 8:0-11:18
require.ensure item b [275] ./example.js 17:0-20:2
chunk {368} 368.output.js (my own chunk) 33 bytes [rendered]
> [275] ./example.js 13:0-15:18
> [275] ./example.js 3:0-6:18
> [275] ./example.js 8:0-11:18
[33] ./node_modules/d.js 11 bytes {126} {368} [built]
cjs require d [275] ./example.js 10:9-21
cjs require d [275] ./example.js 19:9-21
[215] ./node_modules/b.js 11 bytes {126} {368} [built]
require.ensure item b [275] ./example.js 3:0-6:18
require.ensure item b [275] ./example.js 8:0-11:18
require.ensure item b [275] ./example.js 17:0-20:2
[227] ./node_modules/c.js 11 bytes {368} [built]
cjs require c [275] ./example.js 5:9-21
chunk {404} output.js (main) 432 bytes (javascript) 3.65 KiB (runtime) [entry] [rendered]
chunk {179} output.js (main) 432 bytes (javascript) 3.64 KiB (runtime) [entry] [rendered]
> ./example.js main
[54] ./node_modules/a.js 11 bytes {404} [built]
cjs require a [275] ./example.js 1:8-20
[275] ./example.js 421 bytes {404} [built]
[144] ./example.js 421 bytes {179} [built]
entry ./example.js main
[213] ./node_modules/a.js 11 bytes {179} [built]
cjs require a [144] ./example.js 1:8-20
+ 4 hidden chunk modules
chunk {666} 666.output.js (my own chunk) 33 bytes [rendered]
> [144] ./example.js 13:0-15:18
> [144] ./example.js 3:0-6:18
> [144] ./example.js 8:0-11:18
[286] ./node_modules/c.js 11 bytes {666} [built]
cjs require c [144] ./example.js 5:9-21
[644] ./node_modules/b.js 11 bytes {666} {885} [built]
require.ensure item b [144] ./example.js 3:0-6:18
require.ensure item b [144] ./example.js 8:0-11:18
require.ensure item b [144] ./example.js 17:0-20:2
[882] ./node_modules/d.js 11 bytes {666} {885} [built]
cjs require d [144] ./example.js 10:9-21
cjs require d [144] ./example.js 19:9-21
chunk {885} 885.output.js 22 bytes [rendered]
> [144] ./example.js 17:0-20:2
[644] ./node_modules/b.js 11 bytes {666} {885} [built]
require.ensure item b [144] ./example.js 3:0-6:18
require.ensure item b [144] ./example.js 8:0-11:18
require.ensure item b [144] ./example.js 17:0-20:2
[882] ./node_modules/d.js 11 bytes {666} {885} [built]
cjs require d [144] ./example.js 10:9-21
cjs require d [144] ./example.js 19:9-21
```

View File

@ -1,26 +1,25 @@
# example.js
``` javascript
{{example.js}}
```javascript
_{{example.js}}_
```
# dist/output.js
``` javascript
{{dist/output.js}}
```javascript
_{{dist/output.js}}_
```
# dist/126.output.js
# dist/666.output.js
``` javascript
{{dist/126.output.js}}
```javascript
_{{dist/666.output.js}}_
```
# dist/368.output.js
# dist/885.output.js
``` javascript
{{dist/368.output.js}}
```javascript
_{{dist/885.output.js}}_
```
# Info
@ -28,11 +27,11 @@
## Unoptimized
```
{{stdout}}
_{{stdout}}_
```
## Production mode
```
{{production:stdout}}
_{{production:stdout}}_
```

View File

@ -1,6 +1,6 @@
# example.js
``` javascript
```javascript
console.log(process.env.NODE_ENV);
import "react";
@ -12,7 +12,7 @@ import "date-fns";
# webpack.config.js
``` javascript
```javascript
const path = require("path");
module.exports = (env = "development") => ({
mode: env,
@ -28,11 +28,11 @@ module.exports = (env = "development") => ({
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
output.js 1.54 MiB {0} [emitted] main
output.js 1.78 MiB {0} [emitted] main
Entrypoint main = output.js
chunk {0} output.js (main) 1.22 MiB (javascript) 888 bytes (runtime) [entry]
chunk {0} output.js (main) 1.53 MiB (javascript) 1.07 KiB (runtime) [entry]
> ./example.js main
686 chunk modules
526 chunk modules
```

View File

@ -1,17 +1,17 @@
# example.js
``` javascript
{{example.js}}
```javascript
_{{example.js}}_
```
# webpack.config.js
``` javascript
{{webpack.config.js}}
```javascript
_{{webpack.config.js}}_
```
# Info
```
{{stdout}}
_{{stdout}}_
```

View File

@ -112,13 +112,12 @@ function webpackContext(req) {
return __webpack_require__(id);
}
function webpackContextResolve(req) {
var id = map[req];
if(!(id + 1)) { // check for number or string
if(!Object.prototype.hasOwnProperty.call(map, req)) {
var e = new Error("Cannot find module '" + req + "'");
e.code = 'MODULE_NOT_FOUND';
throw e;
}
return id;
return map[req];
}
webpackContext.keys = function webpackContextKeys() {
return Object.keys(map);
@ -176,9 +175,9 @@ module.exports = function() {
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
output.js 3.57 KiB {0} [emitted] main
output.js 3.56 KiB {0} [emitted] main
Entrypoint main = output.js
chunk {0} output.js (main) 603 bytes [entry] [rendered]
> ./example.js main
@ -206,25 +205,25 @@ chunk {0} output.js (main) 603 bytes [entry] [rendered]
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
output.js 868 bytes {404} [emitted] main
output.js 896 bytes {179} [emitted] main
Entrypoint main = output.js
chunk {404} output.js (main) 603 bytes [entry] [rendered]
chunk {179} output.js (main) 603 bytes [entry] [rendered]
> ./example.js main
[117] ./templates/a.js 80 bytes {404} [optional] [built]
context element ./a [545] ./templates sync ^\.\/.*$ ./a
context element ./a.js [545] ./templates sync ^\.\/.*$ ./a.js
[132] ./templates/c.js 80 bytes {404} [optional] [built]
context element ./c [545] ./templates sync ^\.\/.*$ ./c
context element ./c.js [545] ./templates sync ^\.\/.*$ ./c.js
[139] ./templates/b.js 80 bytes {404} [optional] [built]
context element ./b [545] ./templates sync ^\.\/.*$ ./b
context element ./b.js [545] ./templates sync ^\.\/.*$ ./b.js
[275] ./example.js 146 bytes {404} [built]
[144] ./example.js 146 bytes {179} [built]
entry ./example.js main
[545] ./templates sync ^\.\/.*$ 217 bytes {404} [built]
cjs require context ./templates [275] ./example.js 2:8-44
[385] ./templates/b.js 80 bytes {179} [optional] [built]
context element ./b [641] ./templates sync ^\.\/.*$ ./b
context element ./b.js [641] ./templates sync ^\.\/.*$ ./b.js
[641] ./templates sync ^\.\/.*$ 217 bytes {179} [built]
cjs require context ./templates [144] ./example.js 2:8-44
[706] ./templates/a.js 80 bytes {179} [optional] [built]
context element ./a [641] ./templates sync ^\.\/.*$ ./a
context element ./a.js [641] ./templates sync ^\.\/.*$ ./a.js
[965] ./templates/c.js 80 bytes {179} [optional] [built]
context element ./c [641] ./templates sync ^\.\/.*$ ./c
context element ./c.js [641] ./templates sync ^\.\/.*$ ./c.js
```
# Code Splitting

View File

@ -1,7 +1,7 @@
# example.js
``` javascript
{{example.js}}
_{{example.js}}_
```
# templates/
@ -21,7 +21,7 @@ module.exports = function() {
# dist/output.js
``` javascript
{{dist/output.js}}
_{{dist/output.js}}_
```
# Info
@ -29,13 +29,13 @@ module.exports = function() {
## Unoptimized
```
{{stdout}}
_{{stdout}}_
```
## Production mode
```
{{production:stdout}}
_{{production:stdout}}_
```
# Code Splitting

View File

@ -120,7 +120,7 @@ module.exports = Math.random();
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
output.js 2.24 KiB {0} [emitted] main
Entrypoint main = output.js
@ -140,16 +140,16 @@ chunk {0} output.js (main) 313 bytes [entry] [rendered]
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
output.js 333 bytes {404} [emitted] main
output.js 333 bytes {179} [emitted] main
Entrypoint main = output.js
chunk {404} output.js (main) 313 bytes [entry] [rendered]
chunk {179} output.js (main) 313 bytes [entry] [rendered]
> ./example.js main
[162] ./a.js 31 bytes {404} [built]
cjs require ./a [275] ./example.js 1:8-22
require.resolve ./a.js [275] ./example.js 4:10-35
cjs require ./a [275] ./example.js 10:9-23
[275] ./example.js 282 bytes {404} [built]
[144] ./example.js 282 bytes {179} [built]
entry ./example.js main
[847] ./a.js 31 bytes {179} [built]
cjs require ./a [144] ./example.js 1:8-22
require.resolve ./a.js [144] ./example.js 4:10-35
cjs require ./a [144] ./example.js 10:9-23
```

View File

@ -1,20 +1,20 @@
# example.js
``` javascript
{{example.js}}
_{{example.js}}_
```
# a.js
``` javascript
{{a.js}}
_{{a.js}}_
```
# dist/output.js
``` javascript
{{dist/output.js}}
_{{dist/output.js}}_
```
# Info
@ -22,11 +22,11 @@
## Unoptimized
```
{{stdout}}
_{{stdout}}_
```
## Production mode
```
{{production:stdout}}
_{{production:stdout}}_
```

View File

@ -8,9 +8,9 @@ All modules except `cjs` are EcmaScript modules. `cjs` is a CommonJs module.
The interesting thing here is that putting all modules in single scope won't work, because of multiple reasons:
* Modules `lazy`, `c`, `d` and `cjs` need to be in a separate chunk
* Module `shared` is accessed by two chunks (different scopes)
* Module `cjs` is a CommonJs module
- Modules `lazy`, `c`, `d` and `cjs` need to be in a separate chunk
- Module `shared` is accessed by two chunks (different scopes)
- Module `cjs` is a CommonJs module
![](graph2.png)
@ -22,7 +22,7 @@ While module concatenation identifiers in modules are renamed to avoid conflicts
# example.js
``` javascript
```javascript
import { a, x, y } from "a";
import * as b from "b";
@ -33,7 +33,7 @@ import("./lazy").then(function(lazy) {
# lazy.js
``` javascript
```javascript
export * from "c";
import * as d from "d";
export { d };
@ -41,7 +41,7 @@ export { d };
# a.js
``` javascript
```javascript
// module a
export var a = "a";
export * from "shared";
@ -49,7 +49,7 @@ export * from "shared";
# b.js
``` javascript
```javascript
// module b
export function a() {
return "b";
@ -58,7 +58,7 @@ export function a() {
# c.js
``` javascript
```javascript
// module c
import { c as e } from "cjs";
@ -69,21 +69,21 @@ export { x, y } from "shared";
# d.js
``` javascript
```javascript
// module d
export var a = "d";
```
# cjs.js
``` javascript
```javascript
// module cjs (commonjs)
exports.c = "e";
```
# shared.js
``` javascript
```javascript
// shared module
export var x = "x";
export * from "shared2";
@ -91,16 +91,14 @@ export * from "shared2";
# shared2.js
``` javascript
```javascript
// shared2 module
export var y = "y";
```
# webpack.config.js
``` javascript
```javascript
module.exports = {
// mode: "development" || "production",
optimization: {
@ -111,14 +109,11 @@ module.exports = {
};
```
# dist/output.js
<details><summary><code>/******/ (function(modules) { /* webpackBootstrap */ })</code></summary>
``` javascript
```javascript
/******/ (function(modules, runtime) { // webpackBootstrap
/******/ "use strict";
/******/ // The module cache
@ -168,7 +163,7 @@ module.exports = {
</details>
``` javascript
```javascript
/******/ ([
/* 0 */
/*!********************************!*\
@ -200,7 +195,7 @@ function b_a() {
__webpack_require__.e(/*! import() */ 78).then(__webpack_require__.bind(null, /*! ./lazy */ 2)).then(function(lazy) {
__webpack_require__.e(/*! import() */ 262).then(__webpack_require__.bind(null, /*! ./lazy */ 2)).then(function(lazy) {
console.log(a, b_a(), shared["x"], shared["y"], lazy.c, lazy.d.a, lazy.x, lazy.y);
});
@ -309,8 +304,7 @@ var x = "x";
/******/
/******/ /* webpack/runtime/get javascript chunk filename */
/******/ !function() {
/******/
/******/ // This function only allows to reference on-demand chunks
/******/ // This function allow to reference async chunks
/******/ __webpack_require__.u = function(chunkId) {
/******/ // return url for filenames based on template
/******/ return "" + chunkId + ".output.js";
@ -325,7 +319,7 @@ var x = "x";
/******/ // undefined = chunk not loaded, null = chunk preloaded/prefetched
/******/ // Promise = chunk loading, 0 = chunk loaded
/******/ var installedChunks = {
/******/ 404: 0
/******/ 179: 0
/******/ };
/******/
/******/
@ -438,10 +432,10 @@ var x = "x";
</details>
# dist/78.output.js
# dist/262.output.js
``` javascript
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[78],[
```javascript
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[262],[
/* 0 */,
/* 1 */,
/* 2 */
@ -513,8 +507,8 @@ exports.c = "e";
Minimized
``` javascript
(window.webpackJsonp=window.webpackJsonp||[]).push([[78],{78:function(n,r,t){"use strict";t.r(r);var c={};t.r(c),t.d(c,"a",function(){return e});var o=t(719),u=t(852),d=String.fromCharCode(o.c.charCodeAt(0)-2),e="d";t.d(r,"c",function(){return d}),t.d(r,"x",function(){return u.x}),t.d(r,"y",function(){return u.y}),t.d(r,"d",function(){return c})},719:function(n,r){r.c="e"}}]);
```javascript
(window.webpackJsonp=window.webpackJsonp||[]).push([[262],{75:function(n,r){r.c="e"},262:function(n,r,t){"use strict";t.r(r);var c={};t.r(c),t.d(c,"a",function(){return e});var o=t(75),u=t(350),d=String.fromCharCode(o.c.charCodeAt(0)-2),e="d";t.d(r,"c",function(){return d}),t.d(r,"x",function(){return u.x}),t.d(r,"y",function(){return u.y}),t.d(r,"d",function(){return c})}}]);
```
# Info
@ -523,26 +517,17 @@ Minimized
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Asset Size Chunks Chunk Names
78.output.js 2.62 KiB {78} [emitted]
output.js 11.3 KiB {404} [emitted] main
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
262.output.js 2.63 KiB {262} [emitted]
output.js 11.3 KiB {179} [emitted] main
Entrypoint main = output.js
chunk {78} 78.output.js 273 bytes [rendered]
> ./lazy ./example.js 4:0-16
[2] ./lazy.js + 2 modules 231 bytes {78} [built]
[exports: c, d, x, y]
import() ./lazy [0] ./example.js + 2 modules ./example.js 4:0-16
[3] ./node_modules/cjs.js 42 bytes {78} [built]
[only some exports used: c]
harmony side effect evaluation cjs [2] ./lazy.js + 2 modules ./node_modules/c.js 2:0-29
harmony import specifier cjs [2] ./lazy.js + 2 modules ./node_modules/c.js 4:35-36
chunk {404} output.js (main) 372 bytes (javascript) 5.22 KiB (runtime) [entry] [rendered]
chunk {179} output.js (main) 372 bytes (javascript) 5.21 KiB (runtime) [entry] [rendered]
> ./example.js main
[0] ./example.js + 2 modules 272 bytes {404} [built]
[0] ./example.js + 2 modules 272 bytes {179} [built]
[no exports]
entry ./example.js main
[1] ./node_modules/shared.js + 1 modules 100 bytes {404} [built]
[1] ./node_modules/shared.js + 1 modules 100 bytes {179} [built]
[exports: x, y]
[all exports used]
harmony side effect evaluation shared [0] ./example.js + 2 modules ./node_modules/a.js 3:0-23
@ -551,38 +536,47 @@ chunk {404} output.js (main) 372 bytes (javascript) 5.22 KiB (runtime) [entry] [
harmony export imported specifier shared [2] ./lazy.js + 2 modules ./node_modules/c.js 6:0-30
harmony export imported specifier shared [2] ./lazy.js + 2 modules ./node_modules/c.js 6:0-30
+ 8 hidden chunk modules
chunk {262} 262.output.js 273 bytes [rendered]
> ./lazy ./example.js 4:0-16
[2] ./lazy.js + 2 modules 231 bytes {262} [built]
[exports: c, d, x, y]
import() ./lazy [0] ./example.js + 2 modules ./example.js 4:0-16
[3] ./node_modules/cjs.js 42 bytes {262} [built]
[only some exports used: c]
harmony side effect evaluation cjs [2] ./lazy.js + 2 modules ./node_modules/c.js 2:0-29
harmony import specifier cjs [2] ./lazy.js + 2 modules ./node_modules/c.js 4:35-36
```
## Production mode
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Asset Size Chunks Chunk Names
78.output.js 379 bytes {78} [emitted]
output.js 2.25 KiB {404} [emitted] main
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
262.output.js 379 bytes {262} [emitted]
output.js 2.26 KiB {179} [emitted] main
Entrypoint main = output.js
chunk {78} 78.output.js 273 bytes [rendered]
> ./lazy ./example.js 4:0-16
[78] ./lazy.js + 2 modules 231 bytes {78} [built]
[exports: c, d, x, y]
import() ./lazy [258] ./example.js + 2 modules ./example.js 4:0-16
[719] ./node_modules/cjs.js 42 bytes {78} [built]
[only some exports used: c]
harmony side effect evaluation cjs [78] ./lazy.js + 2 modules ./node_modules/c.js 2:0-29
harmony import specifier cjs [78] ./lazy.js + 2 modules ./node_modules/c.js 4:35-36
chunk {404} output.js (main) 372 bytes (javascript) 5.22 KiB (runtime) [entry] [rendered]
chunk {179} output.js (main) 372 bytes (javascript) 5.21 KiB (runtime) [entry] [rendered]
> ./example.js main
[258] ./example.js + 2 modules 272 bytes {404} [built]
[no exports]
entry ./example.js main
[852] ./node_modules/shared.js + 1 modules 100 bytes {404} [built]
[350] ./node_modules/shared.js + 1 modules 100 bytes {179} [built]
[exports: x, y]
[all exports used]
harmony side effect evaluation shared [78] ./lazy.js + 2 modules ./node_modules/c.js 6:0-30
harmony export imported specifier shared [78] ./lazy.js + 2 modules ./node_modules/c.js 6:0-30
harmony export imported specifier shared [78] ./lazy.js + 2 modules ./node_modules/c.js 6:0-30
harmony side effect evaluation shared [258] ./example.js + 2 modules ./node_modules/a.js 3:0-23
harmony export imported specifier shared [258] ./example.js + 2 modules ./node_modules/a.js 3:0-23
harmony side effect evaluation shared [262] ./lazy.js + 2 modules ./node_modules/c.js 6:0-30
harmony export imported specifier shared [262] ./lazy.js + 2 modules ./node_modules/c.js 6:0-30
harmony export imported specifier shared [262] ./lazy.js + 2 modules ./node_modules/c.js 6:0-30
harmony side effect evaluation shared [789] ./example.js + 2 modules ./node_modules/a.js 3:0-23
harmony export imported specifier shared [789] ./example.js + 2 modules ./node_modules/a.js 3:0-23
[789] ./example.js + 2 modules 272 bytes {179} [built]
[no exports]
entry ./example.js main
+ 8 hidden chunk modules
chunk {262} 262.output.js 273 bytes [rendered]
> ./lazy ./example.js 4:0-16
[75] ./node_modules/cjs.js 42 bytes {262} [built]
[only some exports used: c]
harmony side effect evaluation cjs [262] ./lazy.js + 2 modules ./node_modules/c.js 2:0-29
harmony import specifier cjs [262] ./lazy.js + 2 modules ./node_modules/c.js 4:35-36
[262] ./lazy.js + 2 modules 231 bytes {262} [built]
[exports: c, d, x, y]
import() ./lazy [789] ./example.js + 2 modules ./example.js 4:0-16
```

View File

@ -8,9 +8,9 @@ All modules except `cjs` are EcmaScript modules. `cjs` is a CommonJs module.
The interesting thing here is that putting all modules in single scope won't work, because of multiple reasons:
* Modules `lazy`, `c`, `d` and `cjs` need to be in a separate chunk
* Module `shared` is accessed by two chunks (different scopes)
* Module `cjs` is a CommonJs module
- Modules `lazy`, `c`, `d` and `cjs` need to be in a separate chunk
- Module `shared` is accessed by two chunks (different scopes)
- Module `cjs` is a CommonJs module
![](graph2.png)
@ -22,85 +22,80 @@ While module concatenation identifiers in modules are renamed to avoid conflicts
# example.js
``` javascript
{{example.js}}
```javascript
_{{example.js}}_
```
# lazy.js
``` javascript
{{lazy.js}}
```javascript
_{{lazy.js}}_
```
# a.js
``` javascript
{{node_modules/a.js}}
```javascript
_{{node_modules/a.js}}_
```
# b.js
``` javascript
{{node_modules/b.js}}
```javascript
_{{node_modules/b.js}}_
```
# c.js
``` javascript
{{node_modules/c.js}}
```javascript
_{{node_modules/c.js}}_
```
# d.js
``` javascript
{{node_modules/d.js}}
```javascript
_{{node_modules/d.js}}_
```
# cjs.js
``` javascript
{{node_modules/cjs.js}}
```javascript
_{{node_modules/cjs.js}}_
```
# shared.js
``` javascript
{{node_modules/shared.js}}
```javascript
_{{node_modules/shared.js}}_
```
# shared2.js
``` javascript
{{node_modules/shared2.js}}
```javascript
_{{node_modules/shared2.js}}_
```
# webpack.config.js
``` javascript
{{webpack.config.js}}
```javascript
_{{webpack.config.js}}_
```
# dist/output.js
``` javascript
{{dist/output.js}}
```javascript
_{{dist/output.js}}_
```
# dist/78.output.js
# dist/262.output.js
``` javascript
{{dist/78.output.js}}
```javascript
_{{dist/262.output.js}}_
```
Minimized
``` javascript
{{production:dist/78.output.js}}
```javascript
_{{production:dist/262.output.js}}_
```
# Info
@ -108,11 +103,11 @@ Minimized
## Unoptimized
```
{{stdout}}
_{{stdout}}_
```
## Production mode
```
{{production:stdout}}
_{{production:stdout}}_
```

View File

@ -10,12 +10,12 @@ After being built by webpack, the output bundle contains `index.js` `a.js` `b.js
Advantages:
* Smaller bundles
* Faster bootup
- Smaller bundles
- Faster bootup
# example.js
``` javascript
```javascript
import { a as a1, b as b1 } from "big-module";
import { a as a2, b as b2 } from "big-module-with-flag";
@ -29,7 +29,7 @@ console.log(
# node_modules/big-module/package.json
``` javascript
```javascript
{
"name": "big-module"
}
@ -37,7 +37,7 @@ console.log(
# node_modules/big-module-with-flag/package.json
``` javascript
```javascript
{
"name": "big-module-with-flag",
"sideEffects": false
@ -46,7 +46,7 @@ console.log(
# node_modules/big-module(-with-flag)/index.js
``` javascript
```javascript
export { a } from "./a";
export { b } from "./b";
export { c } from "./c";
@ -56,7 +56,7 @@ export { c } from "./c";
<details><summary><code>/******/ (function(modules) { /* webpackBootstrap */ })</code></summary>
``` javascript
```javascript
/******/ (function(modules, runtime) { // webpackBootstrap
/******/ "use strict";
/******/ // The module cache
@ -104,7 +104,7 @@ export { c } from "./c";
</details>
``` javascript
```javascript
/******/ ([
/* 0 */
/*!********************!*\
@ -280,7 +280,7 @@ const b = "b";
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
output.js 7.96 KiB {0} [emitted] main
Entrypoint main = output.js
@ -330,18 +330,18 @@ chunk {0} output.js (main) 325 bytes (javascript) 560 bytes (runtime) [entry] [r
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
output.js 566 bytes {404} [emitted] main
output.js 568 bytes {179} [emitted] main
Entrypoint main = output.js
chunk {404} output.js (main) 325 bytes (javascript) 560 bytes (runtime) [entry] [rendered]
chunk {179} output.js (main) 325 bytes (javascript) 560 bytes (runtime) [entry] [rendered]
> ./example.js main
[56] ./example.js + 6 modules 325 bytes {404} [built]
[no exports]
harmony side effect evaluation ./a ./node_modules/big-module-with-flag/index.js 1:0-24
harmony export imported specifier ./a ./node_modules/big-module-with-flag/index.js 1:0-24
harmony side effect evaluation ./b ./node_modules/big-module-with-flag/index.js 2:0-24
harmony export imported specifier ./b ./node_modules/big-module-with-flag/index.js 2:0-24
entry ./example.js main
[295] ./example.js + 6 modules 325 bytes {179} [built]
[no exports]
harmony side effect evaluation ./a ./node_modules/big-module-with-flag/index.js 1:0-24
harmony export imported specifier ./a ./node_modules/big-module-with-flag/index.js 1:0-24
harmony side effect evaluation ./b ./node_modules/big-module-with-flag/index.js 2:0-24
harmony export imported specifier ./b ./node_modules/big-module-with-flag/index.js 2:0-24
entry ./example.js main
+ 2 hidden chunk modules
```

View File

@ -10,37 +10,37 @@ After being built by webpack, the output bundle contains `index.js` `a.js` `b.js
Advantages:
* Smaller bundles
* Faster bootup
- Smaller bundles
- Faster bootup
# example.js
``` javascript
{{example.js}}
```javascript
_{{example.js}}_
```
# node_modules/big-module/package.json
``` javascript
{{node_modules/big-module/package.json}}
```javascript
_{{node_modules/big-module/package.json}}_
```
# node_modules/big-module-with-flag/package.json
``` javascript
{{node_modules/big-module-with-flag/package.json}}
```javascript
_{{node_modules/big-module-with-flag/package.json}}_
```
# node_modules/big-module(-with-flag)/index.js
``` javascript
{{node_modules/big-module-with-flag/index.js}}
```javascript
_{{node_modules/big-module-with-flag/index.js}}_
```
# dist/output.js
``` javascript
{{dist/output.js}}
```javascript
_{{dist/output.js}}_
```
# Info
@ -48,11 +48,11 @@ Advantages:
## Unoptimized
```
{{stdout}}
_{{stdout}}_
```
## Production mode
```
{{production:stdout}}
_{{production:stdout}}_
```

View File

@ -2,7 +2,7 @@ This example demonstrates various types of source-maps.
# example.coffee
``` coffeescript
```coffeescript
# Taken from http://coffeescript.org/
# Objects:
@ -18,7 +18,7 @@ race = (winner, runners...) ->
# webpack.config.js
``` javascript
```javascript
var path = require("path");
module.exports = [
@ -51,7 +51,8 @@ module.exports = [
# Generated source-maps
## source-map.js and source-map.js.map
``` javascript
```javascript
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[1],[
/* 0 */
/*!*************************************************************!*\
@ -61,8 +62,10 @@ module.exports = [
/*! runtime requirements: */
/***/ (function() {
var math, race,
slice = [].slice;
// Taken from http://coffeescript.org/
// Objects:
var math, race;
math = {
root: Math.sqrt,
@ -72,9 +75,8 @@ math = {
}
};
race = function() {
var runners, winner;
winner = arguments[0], runners = 2 <= arguments.length ? slice.call(arguments, 1) : [];
// Splats:
race = function(winner, ...runners) {
return print(winner, runners);
};
@ -84,12 +86,13 @@ race = function() {
//# sourceMappingURL=bundle-source-map.js.map
```
``` javascript
{"version":3,"sources":["webpack:///./example.coffee"],"names":[],"mappings":";;;;;;;;;AAGA;EAAA;;AAAA,OACE;EAAA,MAAQ,IAAI,CAAC,IAAb;EACA,QAAQ,MADR;EAEA,MAAQ,SAAC,CAAD;WAAO,IAAI,OAAO,CAAP;EAAX,CAFR;;;AAKF,OAAO;AACL;EADM,uBAAQ;SACd,MAAM,MAAN,EAAc,OAAd;AADK","file":"./bundle-source-map.js","sourcesContent":["# Taken from http://coffeescript.org/\n\n# Objects:\nmath =\n root: Math.sqrt\n square: square\n cube: (x) -> x * square x\n\n# Splats:\nrace = (winner, runners...) ->\n print winner, runners\n"],"sourceRoot":""}
```javascript
{"version":3,"sources":["webpack:///./example.coffee"],"names":[],"mappings":";;;;;;;;;AAAA;;;AAAA;;AAGA,OACE;EAAA,MAAQ,IAAI,CAAC,IAAb;EACA,QAAQ,MADR;EAEA,MAAQ,SAAC,CAAD;WAAO,IAAI,OAAO,CAAP;EAAX;AAFR,EAJF;;;AASA,OAAO,SAAC,MAAD,KAAS,OAAT;SACL,MAAM,MAAN,EAAc,OAAd;AADK","file":"./bundle-source-map.js","sourcesContent":["# Taken from http://coffeescript.org/\n\n# Objects:\nmath =\n root: Math.sqrt\n square: square\n cube: (x) -> x * square x\n\n# Splats:\nrace = (winner, runners...) ->\n print winner, runners\n"],"sourceRoot":""}
```
## hidden-source-map.js and hidden-source-map.js.map
``` javascript
```javascript
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[1],[
/* 0 */
/*!*************************************************************!*\
@ -99,8 +102,10 @@ race = function() {
/*! runtime requirements: */
/***/ (function() {
var math, race,
slice = [].slice;
// Taken from http://coffeescript.org/
// Objects:
var math, race;
math = {
root: Math.sqrt,
@ -110,9 +115,8 @@ math = {
}
};
race = function() {
var runners, winner;
winner = arguments[0], runners = 2 <= arguments.length ? slice.call(arguments, 1) : [];
// Splats:
race = function(winner, ...runners) {
return print(winner, runners);
};
@ -121,12 +125,13 @@ race = function() {
],[[0,0]]]);
```
``` javascript
{"version":3,"sources":["webpack:///./example.coffee"],"names":[],"mappings":";;;;;;;;;AAGA;EAAA;;AAAA,OACE;EAAA,MAAQ,IAAI,CAAC,IAAb;EACA,QAAQ,MADR;EAEA,MAAQ,SAAC,CAAD;WAAO,IAAI,OAAO,CAAP;EAAX,CAFR;;;AAKF,OAAO;AACL;EADM,uBAAQ;SACd,MAAM,MAAN,EAAc,OAAd;AADK","file":"./bundle-hidden-source-map.js","sourcesContent":["# Taken from http://coffeescript.org/\n\n# Objects:\nmath =\n root: Math.sqrt\n square: square\n cube: (x) -> x * square x\n\n# Splats:\nrace = (winner, runners...) ->\n print winner, runners\n"],"sourceRoot":""}
```javascript
{"version":3,"sources":["webpack:///./example.coffee"],"names":[],"mappings":";;;;;;;;;AAAA;;;AAAA;;AAGA,OACE;EAAA,MAAQ,IAAI,CAAC,IAAb;EACA,QAAQ,MADR;EAEA,MAAQ,SAAC,CAAD;WAAO,IAAI,OAAO,CAAP;EAAX;AAFR,EAJF;;;AASA,OAAO,SAAC,MAAD,KAAS,OAAT;SACL,MAAM,MAAN,EAAc,OAAd;AADK","file":"./bundle-hidden-source-map.js","sourcesContent":["# Taken from http://coffeescript.org/\n\n# Objects:\nmath =\n root: Math.sqrt\n square: square\n cube: (x) -> x * square x\n\n# Splats:\nrace = (winner, runners...) ->\n print winner, runners\n"],"sourceRoot":""}
```
## inline-source-map.js
``` javascript
```javascript
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[1],[
/* 0 */
/*!*************************************************************!*\
@ -136,8 +141,10 @@ race = function() {
/*! runtime requirements: */
/***/ (function() {
var math, race,
slice = [].slice;
// Taken from http://coffeescript.org/
// Objects:
var math, race;
math = {
root: Math.sqrt,
@ -147,25 +154,26 @@ math = {
}
};
race = function() {
var runners, winner;
winner = arguments[0], runners = 2 <= arguments.length ? slice.call(arguments, 1) : [];
// Splats:
race = function(winner, ...runners) {
return print(winner, runners);
};
/***/ })
],[[0,0]]]);
//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIndlYnBhY2s6Ly8vLi9leGFtcGxlLmNvZmZlZSJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7Ozs7QUFHQTtFQUFBOztBQUFBLE9BQ0U7RUFBQSxNQUFRLElBQUksQ0FBQyxJQUFiO0VBQ0EsUUFBUSxNQURSO0VBRUEsTUFBUSxTQUFDLENBQUQ7V0FBTyxJQUFJLE9BQU8sQ0FBUDtFQUFYLENBRlI7OztBQUtGLE9BQU87QUFDTDtFQURNLHVCQUFRO1NBQ2QsTUFBTSxNQUFOLEVBQWMsT0FBZDtBQURLIiwiZmlsZSI6Ii4vYnVuZGxlLWlubGluZS1zb3VyY2UtbWFwLmpzIiwic291cmNlc0NvbnRlbnQiOlsiIyBUYWtlbiBmcm9tIGh0dHA6Ly9jb2ZmZWVzY3JpcHQub3JnL1xuXG4jIE9iamVjdHM6XG5tYXRoID1cbiAgcm9vdDogICBNYXRoLnNxcnRcbiAgc3F1YXJlOiBzcXVhcmVcbiAgY3ViZTogICAoeCkgLT4geCAqIHNxdWFyZSB4XG5cbiMgU3BsYXRzOlxucmFjZSA9ICh3aW5uZXIsIHJ1bm5lcnMuLi4pIC0+XG4gIHByaW50IHdpbm5lciwgcnVubmVyc1xuIl0sInNvdXJjZVJvb3QiOiIifQ==
//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIndlYnBhY2s6Ly8vLi9leGFtcGxlLmNvZmZlZSJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7Ozs7QUFBQTs7O0FBQUE7O0FBR0EsT0FDRTtFQUFBLE1BQVEsSUFBSSxDQUFDLElBQWI7RUFDQSxRQUFRLE1BRFI7RUFFQSxNQUFRLFNBQUMsQ0FBRDtXQUFPLElBQUksT0FBTyxDQUFQO0VBQVg7QUFGUixFQUpGOzs7QUFTQSxPQUFPLFNBQUMsTUFBRCxLQUFTLE9BQVQ7U0FDTCxNQUFNLE1BQU4sRUFBYyxPQUFkO0FBREsiLCJmaWxlIjoiLi9idW5kbGUtaW5saW5lLXNvdXJjZS1tYXAuanMiLCJzb3VyY2VzQ29udGVudCI6WyIjIFRha2VuIGZyb20gaHR0cDovL2NvZmZlZXNjcmlwdC5vcmcvXG5cbiMgT2JqZWN0czpcbm1hdGggPVxuICByb290OiAgIE1hdGguc3FydFxuICBzcXVhcmU6IHNxdWFyZVxuICBjdWJlOiAgICh4KSAtPiB4ICogc3F1YXJlIHhcblxuIyBTcGxhdHM6XG5yYWNlID0gKHdpbm5lciwgcnVubmVycy4uLikgLT5cbiAgcHJpbnQgd2lubmVyLCBydW5uZXJzXG4iXSwic291cmNlUm9vdCI6IiJ9
```
## nosources-source-map.js.map
``` javascript
{"version":3,"sources":["webpack:///./example.coffee"],"names":[],"mappings":";;;;;;;;;AAGA;EAAA;;AAAA,OACE;EAAA,MAAQ,IAAI,CAAC,IAAb;EACA,QAAQ,MADR;EAEA,MAAQ,SAAC,CAAD;WAAO,IAAI,OAAO,CAAP;EAAX,CAFR;;;AAKF,OAAO;AACL;EADM,uBAAQ;SACd,MAAM,MAAN,EAAc,OAAd;AADK","file":"./bundle-nosources-source-map.js","sourceRoot":""}
```javascript
{"version":3,"sources":["webpack:///./example.coffee"],"names":[],"mappings":";;;;;;;;;AAAA;;;AAAA;;AAGA,OACE;EAAA,MAAQ,IAAI,CAAC,IAAb;EACA,QAAQ,MADR;EAEA,MAAQ,SAAC,CAAD;WAAO,IAAI,OAAO,CAAP;EAAX;AAFR,EAJF;;;AASA,OAAO,SAAC,MAAD,KAAS,OAAT;SACL,MAAM,MAAN,EAAc,OAAd;AADK","file":"./bundle-nosources-source-map.js","sourceRoot":""}
```
## eval-source-map.js
``` javascript
```javascript
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[1],[
/* 0 */
/*!*************************************************************!*\
@ -175,14 +183,15 @@ race = function() {
/*! runtime requirements: */
/***/ (function() {
eval("var math, race,\n slice = [].slice;\n\nmath = {\n root: Math.sqrt,\n square: square,\n cube: function(x) {\n return x * square(x);\n }\n};\n\nrace = function() {\n var runners, winner;\n winner = arguments[0], runners = 2 <= arguments.length ? slice.call(arguments, 1) : [];\n return print(winner, runners);\n};\n//# sourceURL=[module]\n//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiMC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIndlYnBhY2s6Ly8vLi9leGFtcGxlLmNvZmZlZT8yNDE2Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUdBLElBQUEsVUFBQTtFQUFBOztBQUFBLElBQUEsR0FDRTtFQUFBLElBQUEsRUFBUSxJQUFJLENBQUMsSUFBYjtFQUNBLE1BQUEsRUFBUSxNQURSO0VBRUEsSUFBQSxFQUFRLFNBQUMsQ0FBRDtXQUFPLENBQUEsR0FBSSxNQUFBLENBQU8sQ0FBUDtFQUFYLENBRlI7OztBQUtGLElBQUEsR0FBTyxTQUFBO0FBQ0wsTUFBQTtFQURNLHVCQUFRO1NBQ2QsS0FBQSxDQUFNLE1BQU4sRUFBYyxPQUFkO0FBREsiLCJzb3VyY2VzQ29udGVudCI6WyIjIFRha2VuIGZyb20gaHR0cDovL2NvZmZlZXNjcmlwdC5vcmcvXG5cbiMgT2JqZWN0czpcbm1hdGggPVxuICByb290OiAgIE1hdGguc3FydFxuICBzcXVhcmU6IHNxdWFyZVxuICBjdWJlOiAgICh4KSAtPiB4ICogc3F1YXJlIHhcblxuIyBTcGxhdHM6XG5yYWNlID0gKHdpbm5lciwgcnVubmVycy4uLikgLT5cbiAgcHJpbnQgd2lubmVyLCBydW5uZXJzXG4iXX0=\n//# sourceURL=webpack-internal:///0\n");
eval("// Taken from http://coffeescript.org/\n\n// Objects:\nvar math, race;\n\nmath = {\n root: Math.sqrt,\n square: square,\n cube: function(x) {\n return x * square(x);\n }\n};\n\n// Splats:\nrace = function(winner, ...runners) {\n return print(winner, runners);\n};\n//# sourceURL=[module]\n//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiMC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIndlYnBhY2s6Ly8vLi9leGFtcGxlLmNvZmZlZT8yNDE2Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBOzs7QUFBQSxJQUFBLElBQUEsRUFBQTs7QUFHQSxJQUFBLEdBQ0U7RUFBQSxJQUFBLEVBQVEsSUFBSSxDQUFDLElBQWI7RUFDQSxNQUFBLEVBQVEsTUFEUjtFQUVBLElBQUEsRUFBUSxRQUFBLENBQUMsQ0FBRCxDQUFBO1dBQU8sQ0FBQSxHQUFJLE1BQUEsQ0FBTyxDQUFQO0VBQVg7QUFGUixFQUpGOzs7QUFTQSxJQUFBLEdBQU8sUUFBQSxDQUFDLE1BQUQsRUFBQSxHQUFTLE9BQVQsQ0FBQTtTQUNMLEtBQUEsQ0FBTSxNQUFOLEVBQWMsT0FBZDtBQURLIiwic291cmNlc0NvbnRlbnQiOlsiIyBUYWtlbiBmcm9tIGh0dHA6Ly9jb2ZmZWVzY3JpcHQub3JnL1xuXG4jIE9iamVjdHM6XG5tYXRoID1cbiAgcm9vdDogICBNYXRoLnNxcnRcbiAgc3F1YXJlOiBzcXVhcmVcbiAgY3ViZTogICAoeCkgLT4geCAqIHNxdWFyZSB4XG5cbiMgU3BsYXRzOlxucmFjZSA9ICh3aW5uZXIsIHJ1bm5lcnMuLi4pIC0+XG4gIHByaW50IHdpbm5lciwgcnVubmVyc1xuIl19\n//# sourceURL=webpack-internal:///0\n");
/***/ })
],[[0,0]]]);
```
## eval.js
``` javascript
```javascript
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[1],[
/* 0 */
/*!*************************************************************!*\
@ -192,14 +201,15 @@ eval("var math, race,\n slice = [].slice;\n\nmath = {\n root: Math.sqrt,\n sq
/*! runtime requirements: */
/***/ (function() {
eval("var math, race,\n slice = [].slice;\n\nmath = {\n root: Math.sqrt,\n square: square,\n cube: function(x) {\n return x * square(x);\n }\n};\n\nrace = function() {\n var runners, winner;\n winner = arguments[0], runners = 2 <= arguments.length ? slice.call(arguments, 1) : [];\n return print(winner, runners);\n};\n\n\n//# sourceURL=webpack:///./example.coffee?(webpack)/node_modules/coffee-loader");
eval("// Taken from http://coffeescript.org/\n\n// Objects:\nvar math, race;\n\nmath = {\n root: Math.sqrt,\n square: square,\n cube: function(x) {\n return x * square(x);\n }\n};\n\n// Splats:\nrace = function(winner, ...runners) {\n return print(winner, runners);\n};\n\n\n//# sourceURL=webpack:///./example.coffee?(webpack)/node_modules/coffee-loader");
/***/ })
],[[0,0]]]);
```
## cheap-eval-source-map.js
``` javascript
```javascript
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[1],[
/* 0 */
/*!*************************************************************!*\
@ -209,14 +219,15 @@ eval("var math, race,\n slice = [].slice;\n\nmath = {\n root: Math.sqrt,\n sq
/*! runtime requirements: */
/***/ (function() {
eval("var math, race,\n slice = [].slice;\n\nmath = {\n root: Math.sqrt,\n square: square,\n cube: function(x) {\n return x * square(x);\n }\n};\n\nrace = function() {\n var runners, winner;\n winner = arguments[0], runners = 2 <= arguments.length ? slice.call(arguments, 1) : [];\n return print(winner, runners);\n};\n//# sourceURL=[module]\n//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiMC5qcyIsInNvdXJjZXMiOlsid2VicGFjazovLy8uL2V4YW1wbGUuY29mZmVlP2MxNzAiXSwic291cmNlc0NvbnRlbnQiOlsidmFyIG1hdGgsIHJhY2UsXG4gIHNsaWNlID0gW10uc2xpY2U7XG5cbm1hdGggPSB7XG4gIHJvb3Q6IE1hdGguc3FydCxcbiAgc3F1YXJlOiBzcXVhcmUsXG4gIGN1YmU6IGZ1bmN0aW9uKHgpIHtcbiAgICByZXR1cm4geCAqIHNxdWFyZSh4KTtcbiAgfVxufTtcblxucmFjZSA9IGZ1bmN0aW9uKCkge1xuICB2YXIgcnVubmVycywgd2lubmVyO1xuICB3aW5uZXIgPSBhcmd1bWVudHNbMF0sIHJ1bm5lcnMgPSAyIDw9IGFyZ3VtZW50cy5sZW5ndGggPyBzbGljZS5jYWxsKGFyZ3VtZW50cywgMSkgOiBbXTtcbiAgcmV0dXJuIHByaW50KHdpbm5lciwgcnVubmVycyk7XG59O1xuIl0sIm1hcHBpbmdzIjoiQUFBQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTsiLCJzb3VyY2VSb290IjoiIn0=\n//# sourceURL=webpack-internal:///0\n");
eval("// Taken from http://coffeescript.org/\n\n// Objects:\nvar math, race;\n\nmath = {\n root: Math.sqrt,\n square: square,\n cube: function(x) {\n return x * square(x);\n }\n};\n\n// Splats:\nrace = function(winner, ...runners) {\n return print(winner, runners);\n};\n//# sourceURL=[module]\n//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiMC5qcyIsInNvdXJjZXMiOlsid2VicGFjazovLy8uL2V4YW1wbGUuY29mZmVlP2MxNzAiXSwic291cmNlc0NvbnRlbnQiOlsiLy8gVGFrZW4gZnJvbSBodHRwOi8vY29mZmVlc2NyaXB0Lm9yZy9cblxuLy8gT2JqZWN0czpcbnZhciBtYXRoLCByYWNlO1xuXG5tYXRoID0ge1xuICByb290OiBNYXRoLnNxcnQsXG4gIHNxdWFyZTogc3F1YXJlLFxuICBjdWJlOiBmdW5jdGlvbih4KSB7XG4gICAgcmV0dXJuIHggKiBzcXVhcmUoeCk7XG4gIH1cbn07XG5cbi8vIFNwbGF0czpcbnJhY2UgPSBmdW5jdGlvbih3aW5uZXIsIC4uLnJ1bm5lcnMpIHtcbiAgcmV0dXJuIHByaW50KHdpbm5lciwgcnVubmVycyk7XG59O1xuIl0sIm1hcHBpbmdzIjoiQUFBQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBOyIsInNvdXJjZVJvb3QiOiIifQ==\n//# sourceURL=webpack-internal:///0\n");
/***/ })
],[[0,0]]]);
```
## cheap-module-eval-source-map.js
``` javascript
```javascript
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[1],[
/* 0 */
/*!*************************************************************!*\
@ -226,175 +237,177 @@ eval("var math, race,\n slice = [].slice;\n\nmath = {\n root: Math.sqrt,\n sq
/*! runtime requirements: */
/***/ (function() {
eval("var math, race,\n slice = [].slice;\n\nmath = {\n root: Math.sqrt,\n square: square,\n cube: function(x) {\n return x * square(x);\n }\n};\n\nrace = function() {\n var runners, winner;\n winner = arguments[0], runners = 2 <= arguments.length ? slice.call(arguments, 1) : [];\n return print(winner, runners);\n};\n//# sourceURL=[module]\n//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiMC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIndlYnBhY2s6Ly8vLi9leGFtcGxlLmNvZmZlZT8yNDE2Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUdBLElBQUEsVUFBQTtFQUFBOztBQUFBLElBQUEsR0FDRTtFQUFBLElBQUEsRUFBUSxJQUFJLENBQUMsSUFBYjtFQUNBLE1BQUEsRUFBUSxNQURSO0VBRUEsSUFBQSxFQUFRLFNBQUMsQ0FBRDtXQUFPLENBQUEsR0FBSSxNQUFBLENBQU8sQ0FBUDtFQUFYLENBRlI7OztBQUtGLElBQUEsR0FBTyxTQUFBO0FBQ0wsTUFBQTtFQURNLHVCQUFRO1NBQ2QsS0FBQSxDQUFNLE1BQU4sRUFBYyxPQUFkO0FBREsiLCJzb3VyY2VzQ29udGVudCI6WyIjIFRha2VuIGZyb20gaHR0cDovL2NvZmZlZXNjcmlwdC5vcmcvXG5cbiMgT2JqZWN0czpcbm1hdGggPVxuICByb290OiAgIE1hdGguc3FydFxuICBzcXVhcmU6IHNxdWFyZVxuICBjdWJlOiAgICh4KSAtPiB4ICogc3F1YXJlIHhcblxuIyBTcGxhdHM6XG5yYWNlID0gKHdpbm5lciwgcnVubmVycy4uLikgLT5cbiAgcHJpbnQgd2lubmVyLCBydW5uZXJzXG4iXX0=\n//# sourceURL=webpack-internal:///0\n");
eval("// Taken from http://coffeescript.org/\n\n// Objects:\nvar math, race;\n\nmath = {\n root: Math.sqrt,\n square: square,\n cube: function(x) {\n return x * square(x);\n }\n};\n\n// Splats:\nrace = function(winner, ...runners) {\n return print(winner, runners);\n};\n//# sourceURL=[module]\n//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiMC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIndlYnBhY2s6Ly8vLi9leGFtcGxlLmNvZmZlZT8yNDE2Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBOzs7QUFBQSxJQUFBLElBQUEsRUFBQTs7QUFHQSxJQUFBLEdBQ0U7RUFBQSxJQUFBLEVBQVEsSUFBSSxDQUFDLElBQWI7RUFDQSxNQUFBLEVBQVEsTUFEUjtFQUVBLElBQUEsRUFBUSxRQUFBLENBQUMsQ0FBRCxDQUFBO1dBQU8sQ0FBQSxHQUFJLE1BQUEsQ0FBTyxDQUFQO0VBQVg7QUFGUixFQUpGOzs7QUFTQSxJQUFBLEdBQU8sUUFBQSxDQUFDLE1BQUQsRUFBQSxHQUFTLE9BQVQsQ0FBQTtTQUNMLEtBQUEsQ0FBTSxNQUFOLEVBQWMsT0FBZDtBQURLIiwic291cmNlc0NvbnRlbnQiOlsiIyBUYWtlbiBmcm9tIGh0dHA6Ly9jb2ZmZWVzY3JpcHQub3JnL1xuXG4jIE9iamVjdHM6XG5tYXRoID1cbiAgcm9vdDogICBNYXRoLnNxcnRcbiAgc3F1YXJlOiBzcXVhcmVcbiAgY3ViZTogICAoeCkgLT4geCAqIHNxdWFyZSB4XG5cbiMgU3BsYXRzOlxucmFjZSA9ICh3aW5uZXIsIHJ1bm5lcnMuLi4pIC0+XG4gIHByaW50IHdpbm5lciwgcnVubmVyc1xuIl19\n//# sourceURL=webpack-internal:///0\n");
/***/ })
],[[0,0]]]);
```
## cheap-module-source-map.js.map
``` javascript
{"version":3,"file":"./bundle-cheap-module-source-map.js","sources":["webpack:///./example.coffee"],"sourcesContent":["# Taken from http://coffeescript.org/\n\n# Objects:\nmath =\n root: Math.sqrt\n square: square\n cube: (x) -> x * square x\n\n# Splats:\nrace = (winner, runners...) ->\n print winner, runners\n"],"mappings":";;;;;;;;;AAGA;AAAA;AACA;AADA;AACA;AACA;AACA;AAAA;AAAA;;;AAGA;AACA;AADA;AACA;AADA;;;;A","sourceRoot":""}
```javascript
{"version":3,"file":"./bundle-cheap-module-source-map.js","sources":["webpack:///./example.coffee"],"sourcesContent":["# Taken from http://coffeescript.org/\n\n# Objects:\nmath =\n root: Math.sqrt\n square: square\n cube: (x) -> x * square x\n\n# Splats:\nrace = (winner, runners...) ->\n print winner, runners\n"],"mappings":";;;;;;;;;AAAA;AACA;;AADA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAFA;AACA;;AAIA;AACA;AADA;;;;A","sourceRoot":""}
```
## cheap-source-map.js.map
``` javascript
{"version":3,"file":"./bundle-cheap-source-map.js","sources":["webpack:///./example.coffee"],"sourcesContent":["var math, race,\n slice = [].slice;\n\nmath = {\n root: Math.sqrt,\n square: square,\n cube: function(x) {\n return x * square(x);\n }\n};\n\nrace = function() {\n var runners, winner;\n winner = arguments[0], runners = 2 <= arguments.length ? slice.call(arguments, 1) : [];\n return print(winner, runners);\n};\n"],"mappings":";;;;;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;A","sourceRoot":""}
```javascript
{"version":3,"file":"./bundle-cheap-source-map.js","sources":["webpack:///./example.coffee"],"sourcesContent":["// Taken from http://coffeescript.org/\n\n// Objects:\nvar math, race;\n\nmath = {\n root: Math.sqrt,\n square: square,\n cube: function(x) {\n return x * square(x);\n }\n};\n\n// Splats:\nrace = function(winner, ...runners) {\n return print(winner, runners);\n};\n"],"mappings":";;;;;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;A","sourceRoot":""}
```
# webpack output
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Child
Hash: 0a1b2c3d4e5f6a7b8c9d
Asset Size Chunks Chunk Names
./bundle-cheap-eval-source-map.js 1.55 KiB {1} [emitted] bundle
./bundle-cheap-eval-source-map.js 1.44 KiB {1} [emitted] bundle
./runtime~bundle-cheap-eval-source-map.js 4.65 KiB {0} [emitted] runtime~bundle
Entrypoint bundle = ./runtime~bundle-cheap-eval-source-map.js ./bundle-cheap-eval-source-map.js
chunk {0} ./runtime~bundle-cheap-eval-source-map.js (runtime~bundle) 2.24 KiB [entry] [rendered]
> coffee-loader!./example.coffee bundle
1 chunk module
chunk {1} ./bundle-cheap-eval-source-map.js (bundle) 308 bytes [initial] [rendered]
chunk {1} ./bundle-cheap-eval-source-map.js (bundle) 256 bytes [initial] [rendered]
> coffee-loader!./example.coffee bundle
[0] (webpack)/node_modules/coffee-loader!./example.coffee 308 bytes {1} [built]
[0] (webpack)/node_modules/coffee-loader!./example.coffee 256 bytes {1} [built]
[used exports unknown]
entry coffee-loader!./example.coffee bundle
Child
Hash: 0a1b2c3d4e5f6a7b8c9d
Asset Size Chunks Chunk Names
./bundle-cheap-module-eval-source-map.js 1.6 KiB {1} [emitted] bundle
./bundle-cheap-module-eval-source-map.js 1.59 KiB {1} [emitted] bundle
./runtime~bundle-cheap-module-eval-source-map.js 4.65 KiB {0} [emitted] runtime~bundle
Entrypoint bundle = ./runtime~bundle-cheap-module-eval-source-map.js ./bundle-cheap-module-eval-source-map.js
chunk {0} ./runtime~bundle-cheap-module-eval-source-map.js (runtime~bundle) 2.24 KiB [entry] [rendered]
> coffee-loader!./example.coffee bundle
1 chunk module
chunk {1} ./bundle-cheap-module-eval-source-map.js (bundle) 308 bytes [initial] [rendered]
chunk {1} ./bundle-cheap-module-eval-source-map.js (bundle) 256 bytes [initial] [rendered]
> coffee-loader!./example.coffee bundle
[0] (webpack)/node_modules/coffee-loader!./example.coffee 308 bytes {1} [built]
[0] (webpack)/node_modules/coffee-loader!./example.coffee 256 bytes {1} [built]
[used exports unknown]
entry coffee-loader!./example.coffee bundle
Child
Hash: 0a1b2c3d4e5f6a7b8c9d
Asset Size Chunks Chunk Names
./bundle-cheap-module-source-map.js 789 bytes {1} [emitted] bundle
./bundle-cheap-module-source-map.js.map 438 bytes {1} [emitted] bundle
./bundle-cheap-module-source-map.js 737 bytes {1} [emitted] bundle
./bundle-cheap-module-source-map.js.map 443 bytes {1} [emitted] bundle
./runtime~bundle-cheap-module-source-map.js 4.71 KiB {0} [emitted] runtime~bundle
./runtime~bundle-cheap-module-source-map.js.map 4.12 KiB {0} [emitted] runtime~bundle
Entrypoint bundle = ./runtime~bundle-cheap-module-source-map.js ./runtime~bundle-cheap-module-source-map.js.map ./bundle-cheap-module-source-map.js ./bundle-cheap-module-source-map.js.map
chunk {0} ./runtime~bundle-cheap-module-source-map.js, ./runtime~bundle-cheap-module-source-map.js.map (runtime~bundle) 2.24 KiB [entry] [rendered]
> coffee-loader!./example.coffee bundle
1 chunk module
chunk {1} ./bundle-cheap-module-source-map.js, ./bundle-cheap-module-source-map.js.map (bundle) 308 bytes [initial] [rendered]
chunk {1} ./bundle-cheap-module-source-map.js, ./bundle-cheap-module-source-map.js.map (bundle) 256 bytes [initial] [rendered]
> coffee-loader!./example.coffee bundle
[0] (webpack)/node_modules/coffee-loader!./example.coffee 308 bytes {1} [built]
[0] (webpack)/node_modules/coffee-loader!./example.coffee 256 bytes {1} [built]
[used exports unknown]
entry coffee-loader!./example.coffee bundle
Child
Hash: 0a1b2c3d4e5f6a7b8c9d
Asset Size Chunks Chunk Names
./bundle-cheap-source-map.js 782 bytes {1} [emitted] bundle
./bundle-cheap-source-map.js.map 562 bytes {1} [emitted] bundle
./bundle-cheap-source-map.js 730 bytes {1} [emitted] bundle
./bundle-cheap-source-map.js.map 516 bytes {1} [emitted] bundle
./runtime~bundle-cheap-source-map.js 4.71 KiB {0} [emitted] runtime~bundle
./runtime~bundle-cheap-source-map.js.map 4.11 KiB {0} [emitted] runtime~bundle
Entrypoint bundle = ./runtime~bundle-cheap-source-map.js ./runtime~bundle-cheap-source-map.js.map ./bundle-cheap-source-map.js ./bundle-cheap-source-map.js.map
chunk {0} ./runtime~bundle-cheap-source-map.js, ./runtime~bundle-cheap-source-map.js.map (runtime~bundle) 2.24 KiB [entry] [rendered]
> coffee-loader!./example.coffee bundle
1 chunk module
chunk {1} ./bundle-cheap-source-map.js, ./bundle-cheap-source-map.js.map (bundle) 308 bytes [initial] [rendered]
chunk {1} ./bundle-cheap-source-map.js, ./bundle-cheap-source-map.js.map (bundle) 256 bytes [initial] [rendered]
> coffee-loader!./example.coffee bundle
[0] (webpack)/node_modules/coffee-loader!./example.coffee 308 bytes {1} [built]
[0] (webpack)/node_modules/coffee-loader!./example.coffee 256 bytes {1} [built]
[used exports unknown]
entry coffee-loader!./example.coffee bundle
Child
Hash: 0a1b2c3d4e5f6a7b8c9d
Asset Size Chunks Chunk Names
./bundle-eval.js 837 bytes {1} [emitted] bundle
./bundle-eval.js 786 bytes {1} [emitted] bundle
./runtime~bundle-eval.js 4.65 KiB {0} [emitted] runtime~bundle
Entrypoint bundle = ./runtime~bundle-eval.js ./bundle-eval.js
chunk {0} ./runtime~bundle-eval.js (runtime~bundle) 2.24 KiB [entry] [rendered]
> coffee-loader!./example.coffee bundle
1 chunk module
chunk {1} ./bundle-eval.js (bundle) 308 bytes [initial] [rendered]
chunk {1} ./bundle-eval.js (bundle) 256 bytes [initial] [rendered]
> coffee-loader!./example.coffee bundle
[0] (webpack)/node_modules/coffee-loader!./example.coffee 308 bytes {1} [built]
[0] (webpack)/node_modules/coffee-loader!./example.coffee 256 bytes {1} [built]
[used exports unknown]
entry coffee-loader!./example.coffee bundle
Child
Hash: 0a1b2c3d4e5f6a7b8c9d
Asset Size Chunks Chunk Names
./bundle-eval-source-map.js 1.6 KiB {1} [emitted] bundle
./bundle-eval-source-map.js 1.59 KiB {1} [emitted] bundle
./runtime~bundle-eval-source-map.js 4.65 KiB {0} [emitted] runtime~bundle
Entrypoint bundle = ./runtime~bundle-eval-source-map.js ./bundle-eval-source-map.js
chunk {0} ./runtime~bundle-eval-source-map.js (runtime~bundle) 2.24 KiB [entry] [rendered]
> coffee-loader!./example.coffee bundle
1 chunk module
chunk {1} ./bundle-eval-source-map.js (bundle) 308 bytes [initial] [rendered]
chunk {1} ./bundle-eval-source-map.js (bundle) 256 bytes [initial] [rendered]
> coffee-loader!./example.coffee bundle
[0] (webpack)/node_modules/coffee-loader!./example.coffee 308 bytes {1} [built]
[0] (webpack)/node_modules/coffee-loader!./example.coffee 256 bytes {1} [built]
[used exports unknown]
entry coffee-loader!./example.coffee bundle
Child
Hash: 0a1b2c3d4e5f6a7b8c9d
Asset Size Chunks Chunk Names
./bundle-hidden-source-map.js 730 bytes {1} [emitted] bundle
./bundle-hidden-source-map.js.map 535 bytes {1} [emitted] bundle
./bundle-hidden-source-map.js 678 bytes {1} [emitted] bundle
./bundle-hidden-source-map.js.map 546 bytes {1} [emitted] bundle
./runtime~bundle-hidden-source-map.js 4.65 KiB {0} [emitted] runtime~bundle
./runtime~bundle-hidden-source-map.js.map 4.08 KiB {0} [emitted] runtime~bundle
Entrypoint bundle = ./runtime~bundle-hidden-source-map.js ./runtime~bundle-hidden-source-map.js.map ./bundle-hidden-source-map.js ./bundle-hidden-source-map.js.map
chunk {0} ./runtime~bundle-hidden-source-map.js, ./runtime~bundle-hidden-source-map.js.map (runtime~bundle) 2.24 KiB [entry] [rendered]
> coffee-loader!./example.coffee bundle
1 chunk module
chunk {1} ./bundle-hidden-source-map.js, ./bundle-hidden-source-map.js.map (bundle) 308 bytes [initial] [rendered]
chunk {1} ./bundle-hidden-source-map.js, ./bundle-hidden-source-map.js.map (bundle) 256 bytes [initial] [rendered]
> coffee-loader!./example.coffee bundle
[0] (webpack)/node_modules/coffee-loader!./example.coffee 308 bytes {1} [built]
[0] (webpack)/node_modules/coffee-loader!./example.coffee 256 bytes {1} [built]
[used exports unknown]
entry coffee-loader!./example.coffee bundle
Child
Hash: 0a1b2c3d4e5f6a7b8c9d
Asset Size Chunks Chunk Names
./bundle-inline-source-map.js 1.48 KiB {1} [emitted] bundle
./bundle-inline-source-map.js 1.44 KiB {1} [emitted] bundle
./runtime~bundle-inline-source-map.js 10.1 KiB {0} [emitted] runtime~bundle
Entrypoint bundle = ./runtime~bundle-inline-source-map.js ./bundle-inline-source-map.js
chunk {0} ./runtime~bundle-inline-source-map.js (runtime~bundle) 2.24 KiB [entry] [rendered]
> coffee-loader!./example.coffee bundle
1 chunk module
chunk {1} ./bundle-inline-source-map.js (bundle) 308 bytes [initial] [rendered]
chunk {1} ./bundle-inline-source-map.js (bundle) 256 bytes [initial] [rendered]
> coffee-loader!./example.coffee bundle
[0] (webpack)/node_modules/coffee-loader!./example.coffee 308 bytes {1} [built]
[0] (webpack)/node_modules/coffee-loader!./example.coffee 256 bytes {1} [built]
[used exports unknown]
entry coffee-loader!./example.coffee bundle
Child
Hash: 0a1b2c3d4e5f6a7b8c9d
Asset Size Chunks Chunk Names
./bundle-nosources-source-map.js 786 bytes {1} [emitted] bundle
./bundle-nosources-source-map.js.map 315 bytes {1} [emitted] bundle
./bundle-nosources-source-map.js 734 bytes {1} [emitted] bundle
./bundle-nosources-source-map.js.map 326 bytes {1} [emitted] bundle
./runtime~bundle-nosources-source-map.js 4.71 KiB {0} [emitted] runtime~bundle
./runtime~bundle-nosources-source-map.js.map 771 bytes {0} [emitted] runtime~bundle
Entrypoint bundle = ./runtime~bundle-nosources-source-map.js ./runtime~bundle-nosources-source-map.js.map ./bundle-nosources-source-map.js ./bundle-nosources-source-map.js.map
chunk {0} ./runtime~bundle-nosources-source-map.js, ./runtime~bundle-nosources-source-map.js.map (runtime~bundle) 2.24 KiB [entry] [rendered]
> coffee-loader!./example.coffee bundle
1 chunk module
chunk {1} ./bundle-nosources-source-map.js, ./bundle-nosources-source-map.js.map (bundle) 308 bytes [initial] [rendered]
chunk {1} ./bundle-nosources-source-map.js, ./bundle-nosources-source-map.js.map (bundle) 256 bytes [initial] [rendered]
> coffee-loader!./example.coffee bundle
[0] (webpack)/node_modules/coffee-loader!./example.coffee 308 bytes {1} [built]
[0] (webpack)/node_modules/coffee-loader!./example.coffee 256 bytes {1} [built]
[used exports unknown]
entry coffee-loader!./example.coffee bundle
Child
Hash: 0a1b2c3d4e5f6a7b8c9d
Asset Size Chunks Chunk Names
./bundle-source-map.js 776 bytes {1} [emitted] bundle
./bundle-source-map.js.map 528 bytes {1} [emitted] bundle
./bundle-source-map.js 724 bytes {1} [emitted] bundle
./bundle-source-map.js.map 539 bytes {1} [emitted] bundle
./runtime~bundle-source-map.js 4.7 KiB {0} [emitted] runtime~bundle
./runtime~bundle-source-map.js.map 4.07 KiB {0} [emitted] runtime~bundle
Entrypoint bundle = ./runtime~bundle-source-map.js ./runtime~bundle-source-map.js.map ./bundle-source-map.js ./bundle-source-map.js.map
chunk {0} ./runtime~bundle-source-map.js, ./runtime~bundle-source-map.js.map (runtime~bundle) 2.24 KiB [entry] [rendered]
> coffee-loader!./example.coffee bundle
1 chunk module
chunk {1} ./bundle-source-map.js, ./bundle-source-map.js.map (bundle) 308 bytes [initial] [rendered]
chunk {1} ./bundle-source-map.js, ./bundle-source-map.js.map (bundle) 256 bytes [initial] [rendered]
> coffee-loader!./example.coffee bundle
[0] (webpack)/node_modules/coffee-loader!./example.coffee 308 bytes {1} [built]
[0] (webpack)/node_modules/coffee-loader!./example.coffee 256 bytes {1} [built]
[used exports unknown]
entry coffee-loader!./example.coffee bundle
```

View File

@ -2,78 +2,88 @@ This example demonstrates various types of source-maps.
# example.coffee
``` coffeescript
{{example.coffee}}
```coffeescript
_{{example.coffee}}_
```
# webpack.config.js
``` javascript
{{webpack.config.js}}
```javascript
_{{webpack.config.js}}_
```
# Generated source-maps
## source-map.js and source-map.js.map
``` javascript
{{dist/bundle-source-map.js}}
```javascript
_{{dist/bundle-source-map.js}}_
```
``` javascript
{{dist/bundle-source-map.js.map}}
```javascript
_{{dist/bundle-source-map.js.map}}_
```
## hidden-source-map.js and hidden-source-map.js.map
``` javascript
{{dist/bundle-hidden-source-map.js}}
```javascript
_{{dist/bundle-hidden-source-map.js}}_
```
``` javascript
{{dist/bundle-hidden-source-map.js.map}}
```javascript
_{{dist/bundle-hidden-source-map.js.map}}_
```
## inline-source-map.js
``` javascript
{{dist/bundle-inline-source-map.js}}
```javascript
_{{dist/bundle-inline-source-map.js}}_
```
## nosources-source-map.js.map
``` javascript
{{dist/bundle-nosources-source-map.js.map}}
```javascript
_{{dist/bundle-nosources-source-map.js.map}}_
```
## eval-source-map.js
``` javascript
{{dist/bundle-eval-source-map.js}}
```javascript
_{{dist/bundle-eval-source-map.js}}_
```
## eval.js
``` javascript
{{dist/bundle-eval.js}}
```javascript
_{{dist/bundle-eval.js}}_
```
## cheap-eval-source-map.js
``` javascript
{{dist/bundle-cheap-eval-source-map.js}}
```javascript
_{{dist/bundle-cheap-eval-source-map.js}}_
```
## cheap-module-eval-source-map.js
``` javascript
{{dist/bundle-cheap-module-eval-source-map.js}}
```javascript
_{{dist/bundle-cheap-module-eval-source-map.js}}_
```
## cheap-module-source-map.js.map
``` javascript
{{dist/bundle-cheap-module-source-map.js.map}}
```javascript
_{{dist/bundle-cheap-module-source-map.js.map}}_
```
## cheap-source-map.js.map
``` javascript
{{dist/bundle-cheap-source-map.js.map}}
```javascript
_{{dist/bundle-cheap-source-map.js.map}}_
```
# webpack output
```
{{stdout}}
_{{stdout}}_
```

View File

@ -57,15 +57,15 @@ exports.replaceBase = (template) => {
};
exports.needResults = (template, prefix) => {
const regExp = prefix ? new RegExp(`\\{\\{${prefix}:`) : /\{\{/;
const regExp = prefix ? new RegExp(`_\\{\\{${prefix}:`) : /_\{\{/;
return regExp.test(template);
};
exports.replaceResults = (template, baseDir, stdout, prefix) => {
const regexp = new RegExp("\\{\\{" + (prefix ? prefix + ":" : "") + "([^:\\}]+)\\}\\}", "g");
const regexp = new RegExp("_\\{\\{" + (prefix ? prefix + ":" : "") + "([^:\\}]+)\\}\\}_", "g");
return template.replace(regexp, function(match) {
match = match.substr(2 + (prefix ? prefix.length + 1 : 0), match.length - 4 - (prefix ? prefix.length + 1 : 0));
match = match.substr(3 + (prefix ? prefix.length + 1 : 0), match.length - 6 - (prefix ? prefix.length + 1 : 0));
if(match === "stdout")
return stdout;
return fs.readFileSync(path.join(baseDir, match), "utf-8").replace(/[\r\n]*$/, "");

View File

@ -1,6 +1,6 @@
# webpack.config.js
``` javascript
```javascript
var path = require("path");
module.exports = {
// mode: "development || "production",
@ -38,7 +38,7 @@ module.exports = {
<details><summary><code>/******/ (function(modules) { /* webpackBootstrap */ })</code></summary>
``` javascript
```javascript
/******/ (function(modules, runtime) { // webpackBootstrap
/******/ "use strict";
/******/ // The module cache
@ -84,7 +84,7 @@ module.exports = {
</details>
``` javascript
```javascript
/******/ ([
/* 0 */
/*!********************!*\
@ -102,7 +102,7 @@ module.exports = "Vendor1";
# dist/vendor2.js
``` javascript
```javascript
/******/ (function(modules, runtime) { // webpackBootstrap
/******/ "use strict";
/******/ // The module cache
@ -174,7 +174,7 @@ __webpack_require__(/*! ./vendor1 */ 0);
# dist/pageA.js
``` javascript
```javascript
/******/ (function(modules, runtime) { // webpackBootstrap
/******/ "use strict";
/******/ // The module cache
@ -264,7 +264,7 @@ __webpack_require__(/*! ./vendor2 */ 1);
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
pageA.js 2.26 KiB {2} [emitted] pageA
pageB.js 1.52 KiB {3} [emitted] pageB
@ -324,50 +324,50 @@ chunk {4} pageC.js (pageC) 25 bytes [entry] [rendered]
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
pageA.js 320 bytes {331}, {637}, {641} [emitted] pageA
pageB.js 217 bytes {791} [emitted] pageB
pageC.js 217 bytes {42} [emitted] pageC
vendor1.js 219 bytes {637} [emitted] vendor1
vendor2.js 267 bytes {331}, {637} [emitted] vendor2
pageA.js 320 bytes {374}, {424}, {971} [emitted] pageA
pageB.js 217 bytes {121} [emitted] pageB
pageC.js 217 bytes {178} [emitted] pageC
vendor1.js 219 bytes {971} [emitted] vendor1
vendor2.js 267 bytes {374}, {971} [emitted] vendor2
Entrypoint vendor1 = vendor1.js
Entrypoint vendor2 = vendor2.js
Entrypoint pageA = pageA.js
Entrypoint pageB = pageB.js
Entrypoint pageC = pageC.js
chunk {42} pageC.js (pageC) 25 bytes [entry] [rendered]
> ./pageC pageC
[912] ./pageC.js 25 bytes {42} [built]
entry ./pageC pageC
chunk {331} vendor2.js (vendor2) 77 bytes [entry] [rendered]
> ./vendor2 vendor2
[123] ./vendor2.js 50 bytes {331} {641} [built]
cjs require ./vendor2 [953] ./pageA.js 3:0-20
entry ./vendor2 vendor2
[578] ./vendor1.js 27 bytes {331} {637} {641} [built]
cjs require ./vendor1 [123] ./vendor2.js 2:0-20
cjs require ./vendor1 [953] ./pageA.js 2:0-20
entry ./vendor1 vendor1
chunk {637} vendor1.js (vendor1) 27 bytes [entry] [rendered]
> ./vendor1 vendor1
[578] ./vendor1.js 27 bytes {331} {637} {641} [built]
cjs require ./vendor1 [123] ./vendor2.js 2:0-20
cjs require ./vendor1 [953] ./pageA.js 2:0-20
entry ./vendor1 vendor1
chunk {641} pageA.js (pageA) 147 bytes [entry] [rendered]
> ./pageA pageA
[123] ./vendor2.js 50 bytes {331} {641} [built]
cjs require ./vendor2 [953] ./pageA.js 3:0-20
entry ./vendor2 vendor2
[578] ./vendor1.js 27 bytes {331} {637} {641} [built]
cjs require ./vendor1 [123] ./vendor2.js 2:0-20
cjs require ./vendor1 [953] ./pageA.js 2:0-20
entry ./vendor1 vendor1
[953] ./pageA.js 70 bytes {641} [built]
entry ./pageA pageA
chunk {791} pageB.js (pageB) 25 bytes [entry] [rendered]
chunk {121} pageB.js (pageB) 25 bytes [entry] [rendered]
> ./pageB pageB
[954] ./pageB.js 25 bytes {791} [built]
[588] ./pageB.js 25 bytes {121} [built]
entry ./pageB pageB
chunk {178} pageC.js (pageC) 25 bytes [entry] [rendered]
> ./pageC pageC
[145] ./pageC.js 25 bytes {178} [built]
entry ./pageC pageC
chunk {374} vendor2.js (vendor2) 77 bytes [entry] [rendered]
> ./vendor2 vendor2
[117] ./vendor2.js 50 bytes {374} {424} [built]
cjs require ./vendor2 [366] ./pageA.js 3:0-20
entry ./vendor2 vendor2
[466] ./vendor1.js 27 bytes {374} {424} {971} [built]
cjs require ./vendor1 [117] ./vendor2.js 2:0-20
cjs require ./vendor1 [366] ./pageA.js 2:0-20
entry ./vendor1 vendor1
chunk {424} pageA.js (pageA) 147 bytes [entry] [rendered]
> ./pageA pageA
[117] ./vendor2.js 50 bytes {374} {424} [built]
cjs require ./vendor2 [366] ./pageA.js 3:0-20
entry ./vendor2 vendor2
[366] ./pageA.js 70 bytes {424} [built]
entry ./pageA pageA
[466] ./vendor1.js 27 bytes {374} {424} {971} [built]
cjs require ./vendor1 [117] ./vendor2.js 2:0-20
cjs require ./vendor1 [366] ./pageA.js 2:0-20
entry ./vendor1 vendor1
chunk {971} vendor1.js (vendor1) 27 bytes [entry] [rendered]
> ./vendor1 vendor1
[466] ./vendor1.js 27 bytes {374} {424} {971} [built]
cjs require ./vendor1 [117] ./vendor2.js 2:0-20
cjs require ./vendor1 [366] ./pageA.js 2:0-20
entry ./vendor1 vendor1
```

View File

@ -1,25 +1,25 @@
# webpack.config.js
``` javascript
{{webpack.config.js}}
```javascript
_{{webpack.config.js}}_
```
# dist/vendor1.js
``` javascript
{{dist/vendor1.js}}
```javascript
_{{dist/vendor1.js}}_
```
# dist/vendor2.js
``` javascript
{{dist/vendor2.js}}
```javascript
_{{dist/vendor2.js}}_
```
# dist/pageA.js
``` javascript
{{dist/pageA.js}}
```javascript
_{{dist/pageA.js}}_
```
# Info
@ -27,11 +27,11 @@
## Unoptimized
```
{{stdout}}
_{{stdout}}_
```
## Production mode
```
{{production:stdout}}
_{{production:stdout}}_
```

View File

@ -4,7 +4,7 @@ WebAssembly modules can be imported like other modules. Their download and compi
# example.js
``` javascript
```javascript
import("./add.wasm").then(addModule => {
console.log(addModule.add(22, 2200));
import("./math").then(math => {
@ -35,7 +35,7 @@ function timed(name, fn) {
# math.js
``` javascript
```javascript
import { add } from "./add.wasm";
import { factorial } from "./factorial.wasm";
import { fibonacci } from "./fibonacci.wasm";
@ -57,7 +57,7 @@ export function fibonacciJavascript(i) {
<details><summary><code>/******/ (function(modules) { /* webpackBootstrap */ })</code></summary>
``` javascript
```javascript
/******/ (function(modules, runtime) { // webpackBootstrap
/******/ "use strict";
/******/ // The module cache
@ -110,7 +110,7 @@ export function fibonacciJavascript(i) {
</details>
``` javascript
```javascript
/******/ ([
/* 0 */
/*!********************!*\
@ -120,9 +120,9 @@ export function fibonacciJavascript(i) {
/*! runtime requirements: __webpack_require__.e__webpack_require__, */
/***/ (function(__unusedmodule, __unusedexports, __webpack_require__) {
__webpack_require__.e(/*! import() */ 183).then(__webpack_require__.bind(null, /*! ./add.wasm */ 1)).then(addModule => {
__webpack_require__.e(/*! import() */ 461).then(__webpack_require__.bind(null, /*! ./add.wasm */ 1)).then(addModule => {
console.log(addModule.add(22, 2200));
__webpack_require__.e(/*! import() */ 702).then(__webpack_require__.bind(null, /*! ./math */ 2)).then(math => {
__webpack_require__.e(/*! import() */ 451).then(__webpack_require__.bind(null, /*! ./math */ 2)).then(math => {
console.log(math.add(10, 101));
console.log(math.factorial(15));
console.log(math.factorialJavascript(15));
@ -197,8 +197,7 @@ function timed(name, fn) {
/******/
/******/ /* webpack/runtime/get javascript chunk filename */
/******/ !function() {
/******/
/******/ // This function only allows to reference on-demand chunks
/******/ // This function allow to reference async chunks
/******/ __webpack_require__.u = function(chunkId) {
/******/ // return url for filenames based on template
/******/ return "" + chunkId + ".output.js";
@ -213,7 +212,7 @@ function timed(name, fn) {
/******/ // undefined = chunk not loaded, null = chunk preloaded/prefetched
/******/ // Promise = chunk loading, 0 = chunk loaded
/******/ var installedChunks = {
/******/ 404: 0
/******/ 179: 0
/******/ };
/******/
/******/
@ -333,11 +332,6 @@ function timed(name, fn) {
/******/
/******/ };
/******/ },
/******/ 1: function() {
/******/ return {
/******/
/******/ };
/******/ },
/******/ 3: function() {
/******/ return {
/******/
@ -348,16 +342,21 @@ function timed(name, fn) {
/******/
/******/ };
/******/ },
/******/ 1: function() {
/******/ return {
/******/
/******/ };
/******/ },
/******/ };
/******/
/******/ var wasmModuleMap = {
/******/ "183": [
/******/ 1
/******/ ],
/******/ "702": [
/******/ "451": [
/******/ 1,
/******/ 3,
/******/ 4
/******/ ],
/******/ "461": [
/******/ 1
/******/ ]
/******/ };
/******/
@ -377,7 +376,7 @@ function timed(name, fn) {
/******/ promises.push(installedWasmModuleData);
/******/ else {
/******/ var importObject = wasmImportObjects[wasmModuleId]();
/******/ var req = fetch(__webpack_require__.p + "" + {"1":"768a5da4710725bcb100","3":"41a5c50a2d48fb358c38","4":"98df0027b722ce87102e"}[wasmModuleId] + ".wasm");
/******/ var req = fetch(__webpack_require__.p + "" + {"1":"796ebb0fde2fd9366416","3":"f8c3f5244aa6dfa83d5d","4":"91af48c8382460c02425"}[wasmModuleId] + ".wasm");
/******/ var promise;
/******/ if(importObject instanceof Promise && typeof WebAssembly.compileStreaming === 'function') {
/******/ promise = Promise.all([WebAssembly.compileStreaming(req), importObject]).then(function(items) {
@ -406,10 +405,10 @@ function timed(name, fn) {
</details>
# dist/183.output.js
# dist/451.output.js
``` javascript
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[183],[
```javascript
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[451],[
/* 0 */,
/* 1 */
/*!******************!*\
@ -417,50 +416,20 @@ function timed(name, fn) {
\******************/
/*! export add [provided] [no usage info] [missing usage info prevents renaming] */
/*! other exports [not provided] [no usage info] */
/*! runtime requirements: module__webpack_require__.w, __webpack_exports__, __webpack_require__, */
/*! runtime requirements: module__webpack_require__.w, __webpack_require__.r, __webpack_exports__, __webpack_require__, */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
// Instantiate WebAssembly module
var wasmExports = __webpack_require__.w[module.i];
__webpack_require__.r(exports);
// export exports from WebAssembly module
for(var name in wasmExports) if(name != "__webpack_init__") exports[name] = wasmExports[name];
for(var name in wasmExports) if(name) exports[name] = wasmExports[name];
// exec imports from WebAssembly module (for esm order)
// exec wasm module
wasmExports["__webpack_init__"]()
/***/ })
]]);
```
# dist/702.output.js
``` javascript
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[702],[
/* 0 */,
/* 1 */
/*!******************!*\
!*** ./add.wasm ***!
\******************/
/*! export add [provided] [no usage info] [missing usage info prevents renaming] */
/*! other exports [not provided] [no usage info] */
/*! runtime requirements: module__webpack_require__.w, __webpack_exports__, __webpack_require__, */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
// Instantiate WebAssembly module
var wasmExports = __webpack_require__.w[module.i];
// export exports from WebAssembly module
for(var name in wasmExports) if(name != "__webpack_init__") exports[name] = wasmExports[name];
// exec imports from WebAssembly module (for esm order)
// exec wasm module
wasmExports["__webpack_init__"]()
wasmExports[""]()
/***/ }),
/* 2 */
@ -510,20 +479,20 @@ function fibonacciJavascript(i) {
\************************/
/*! export factorial [provided] [no usage info] [missing usage info prevents renaming] */
/*! other exports [not provided] [no usage info] */
/*! runtime requirements: module__webpack_require__.w, __webpack_exports__, __webpack_require__, */
/*! runtime requirements: module__webpack_require__.w, __webpack_require__.r, __webpack_exports__, __webpack_require__, */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
// Instantiate WebAssembly module
var wasmExports = __webpack_require__.w[module.i];
__webpack_require__.r(exports);
// export exports from WebAssembly module
for(var name in wasmExports) if(name != "__webpack_init__") exports[name] = wasmExports[name];
for(var name in wasmExports) if(name) exports[name] = wasmExports[name];
// exec imports from WebAssembly module (for esm order)
// exec wasm module
wasmExports["__webpack_init__"]()
wasmExports[""]()
/***/ }),
/* 4 */
@ -532,20 +501,50 @@ wasmExports["__webpack_init__"]()
\************************/
/*! export fibonacci [provided] [no usage info] [missing usage info prevents renaming] */
/*! other exports [not provided] [no usage info] */
/*! runtime requirements: module__webpack_require__.w, __webpack_exports__, __webpack_require__, */
/*! runtime requirements: module__webpack_require__.w, __webpack_require__.r, __webpack_exports__, __webpack_require__, */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
// Instantiate WebAssembly module
var wasmExports = __webpack_require__.w[module.i];
__webpack_require__.r(exports);
// export exports from WebAssembly module
for(var name in wasmExports) if(name != "__webpack_init__") exports[name] = wasmExports[name];
for(var name in wasmExports) if(name) exports[name] = wasmExports[name];
// exec imports from WebAssembly module (for esm order)
// exec wasm module
wasmExports["__webpack_init__"]()
wasmExports[""]()
/***/ })
]]);
```
# dist/461.output.js
```javascript
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[461],[
/* 0 */,
/* 1 */
/*!******************!*\
!*** ./add.wasm ***!
\******************/
/*! export add [provided] [no usage info] [missing usage info prevents renaming] */
/*! other exports [not provided] [no usage info] */
/*! runtime requirements: module__webpack_require__.w, __webpack_require__.r, __webpack_exports__, __webpack_require__, */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
// Instantiate WebAssembly module
var wasmExports = __webpack_require__.w[module.i];
__webpack_require__.r(exports);
// export exports from WebAssembly module
for(var name in wasmExports) if(name) exports[name] = wasmExports[name];
// exec imports from WebAssembly module (for esm order)
// exec wasm module
wasmExports[""]()
/***/ })
]]);
@ -557,96 +556,96 @@ wasmExports["__webpack_init__"]()
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
183.output.js 815 bytes {183} [emitted]
41a5c50a2d48fb358c38.wasm 88 bytes {702} [emitted]
702.output.js 4.42 KiB {702} [emitted]
768a5da4710725bcb100.wasm 67 bytes {183}, {702} [emitted]
98df0027b722ce87102e.wasm 93 bytes {702} [emitted]
output.js 11.9 KiB {404} [emitted] main
451.output.js 4.47 KiB {451} [emitted]
461.output.js 831 bytes {461} [emitted]
796ebb0fde2fd9366416.wasm 51 bytes {451}, {461} [emitted]
91af48c8382460c02425.wasm 77 bytes {451} [emitted]
f8c3f5244aa6dfa83d5d.wasm 72 bytes {451} [emitted]
output.js 11.9 KiB {179} [emitted] main
Entrypoint main = output.js
chunk {183} 183.output.js, 768a5da4710725bcb100.wasm 100 bytes (javascript) 41 bytes (webassembly) [rendered]
> ./add.wasm [0] ./example.js 1:0-20
[1] ./add.wasm 100 bytes (javascript) 41 bytes (webassembly) {183} {702} [built]
[exports: add]
[used exports unknown]
import() ./add.wasm [0] ./example.js 1:0-20
harmony side effect evaluation ./add.wasm [2] ./math.js 1:0-33
harmony export imported specifier ./add.wasm [2] ./math.js 5:0-37
chunk {404} output.js (main) 762 bytes (javascript) 6.06 KiB (runtime) [entry] [rendered]
chunk {179} output.js (main) 762 bytes (javascript) 6.05 KiB (runtime) [entry] [rendered]
> ./example.js main
[0] ./example.js 762 bytes {404} [built]
[0] ./example.js 762 bytes {179} [built]
[used exports unknown]
entry ./example.js main
+ 7 hidden chunk modules
chunk {702} 702.output.js, 768a5da4710725bcb100.wasm, 41a5c50a2d48fb358c38.wasm, 98df0027b722ce87102e.wasm 700 bytes (javascript) 170 bytes (webassembly) [rendered]
chunk {451} 451.output.js, 796ebb0fde2fd9366416.wasm, f8c3f5244aa6dfa83d5d.wasm, 91af48c8382460c02425.wasm 700 bytes (javascript) 170 bytes (webassembly) [rendered]
> ./math [0] ./example.js 3:1-17
[1] ./add.wasm 100 bytes (javascript) 41 bytes (webassembly) {183} {702} [built]
[1] ./add.wasm 100 bytes (javascript) 41 bytes (webassembly) {451} {461} [built]
[exports: add]
[used exports unknown]
import() ./add.wasm [0] ./example.js 1:0-20
harmony side effect evaluation ./add.wasm [2] ./math.js 1:0-33
harmony export imported specifier ./add.wasm [2] ./math.js 5:0-37
[2] ./math.js 400 bytes {702} [built]
[2] ./math.js 400 bytes {451} [built]
[exports: add, factorial, factorialJavascript, fibonacci, fibonacciJavascript]
[used exports unknown]
import() ./math [0] ./example.js 3:1-17
[3] ./factorial.wasm 100 bytes (javascript) 62 bytes (webassembly) {702} [built]
[3] ./factorial.wasm 100 bytes (javascript) 62 bytes (webassembly) {451} [built]
[exports: factorial]
[used exports unknown]
harmony side effect evaluation ./factorial.wasm [2] ./math.js 2:0-45
harmony export imported specifier ./factorial.wasm [2] ./math.js 5:0-37
[4] ./fibonacci.wasm 100 bytes (javascript) 67 bytes (webassembly) {702} [built]
[4] ./fibonacci.wasm 100 bytes (javascript) 67 bytes (webassembly) {451} [built]
[exports: fibonacci]
[used exports unknown]
harmony side effect evaluation ./fibonacci.wasm [2] ./math.js 3:0-45
harmony export imported specifier ./fibonacci.wasm [2] ./math.js 5:0-37
chunk {461} 461.output.js, 796ebb0fde2fd9366416.wasm 100 bytes (javascript) 41 bytes (webassembly) [rendered]
> ./add.wasm [0] ./example.js 1:0-20
[1] ./add.wasm 100 bytes (javascript) 41 bytes (webassembly) {451} {461} [built]
[exports: add]
[used exports unknown]
import() ./add.wasm [0] ./example.js 1:0-20
harmony side effect evaluation ./add.wasm [2] ./math.js 1:0-33
harmony export imported specifier ./add.wasm [2] ./math.js 5:0-37
```
## Production mode
```
Hash: 0a1b2c3d4e5f6a7b8c9d
Version: webpack 5.0.0-alpha.9
Version: webpack 5.0.0-alpha.11
Asset Size Chunks Chunk Names
183.output.js 189 bytes {183} [emitted]
67213a60abcf4f23c6b4.wasm 78 bytes {183}, {702} [emitted]
702.output.js 715 bytes {183}, {702} [emitted]
a4570b6a86c9fb8795ab.wasm 67 bytes {183}, {702} [emitted]
f5e82906cffdecdc383f.wasm 73 bytes {183}, {702} [emitted]
output.js 3.06 KiB {404} [emitted] main
0fdec8168d54770f0f62.wasm 51 bytes {451}, {461} [emitted]
451.output.js 668 bytes {451}, {461} [emitted]
461.output.js 156 bytes {461} [emitted]
5fc3e77f8ecdd320f3e0.wasm 69 bytes {451}, {461} [emitted]
81a4c3dd4ea06365035d.wasm 64 bytes {451}, {461} [emitted]
output.js 3.06 KiB {179} [emitted] main
Entrypoint main = output.js
chunk {183} 183.output.js, a4570b6a86c9fb8795ab.wasm 100 bytes (javascript) 41 bytes (webassembly) [rendered]
> ./add.wasm [275] ./example.js 1:0-20
[183] ./add.wasm 100 bytes (javascript) 41 bytes (webassembly) {183} {702} [built]
[exports: add]
import() ./add.wasm [275] ./example.js 1:0-20
harmony side effect evaluation ./add.wasm [702] ./math.js 1:0-33
harmony export imported specifier ./add.wasm [702] ./math.js 5:0-37
chunk {404} output.js (main) 762 bytes (javascript) 6.08 KiB (runtime) [entry] [rendered]
chunk {179} output.js (main) 762 bytes (javascript) 6.07 KiB (runtime) [entry] [rendered]
> ./example.js main
[275] ./example.js 762 bytes {404} [built]
[144] ./example.js 762 bytes {179} [built]
entry ./example.js main
+ 7 hidden chunk modules
chunk {702} 702.output.js, a4570b6a86c9fb8795ab.wasm, 67213a60abcf4f23c6b4.wasm, f5e82906cffdecdc383f.wasm 700 bytes (javascript) 170 bytes (webassembly) [rendered]
> ./math [275] ./example.js 3:1-17
[183] ./add.wasm 100 bytes (javascript) 41 bytes (webassembly) {183} {702} [built]
[exports: add]
import() ./add.wasm [275] ./example.js 1:0-20
harmony side effect evaluation ./add.wasm [702] ./math.js 1:0-33
harmony export imported specifier ./add.wasm [702] ./math.js 5:0-37
[323] ./fibonacci.wasm 100 bytes (javascript) 67 bytes (webassembly) {702} [built]
[exports: fibonacci]
[all exports used]
harmony side effect evaluation ./fibonacci.wasm [702] ./math.js 3:0-45
harmony export imported specifier ./fibonacci.wasm [702] ./math.js 5:0-37
[702] ./math.js 400 bytes {702} [built]
[exports: add, factorial, factorialJavascript, fibonacci, fibonacciJavascript]
import() ./math [275] ./example.js 3:1-17
[707] ./factorial.wasm 100 bytes (javascript) 62 bytes (webassembly) {702} [built]
chunk {451} 451.output.js, 81a4c3dd4ea06365035d.wasm, 0fdec8168d54770f0f62.wasm, 5fc3e77f8ecdd320f3e0.wasm 700 bytes (javascript) 170 bytes (webassembly) [rendered]
> ./math [144] ./example.js 3:1-17
[78] ./factorial.wasm 100 bytes (javascript) 62 bytes (webassembly) {451} [built]
[exports: factorial]
[all exports used]
harmony side effect evaluation ./factorial.wasm [702] ./math.js 2:0-45
harmony export imported specifier ./factorial.wasm [702] ./math.js 5:0-37
harmony side effect evaluation ./factorial.wasm [451] ./math.js 2:0-45
harmony export imported specifier ./factorial.wasm [451] ./math.js 5:0-37
[451] ./math.js 400 bytes {451} [built]
[exports: add, factorial, factorialJavascript, fibonacci, fibonacciJavascript]
import() ./math [144] ./example.js 3:1-17
[461] ./add.wasm 100 bytes (javascript) 41 bytes (webassembly) {451} {461} [built]
[exports: add]
import() ./add.wasm [144] ./example.js 1:0-20
harmony side effect evaluation ./add.wasm [451] ./math.js 1:0-33
harmony export imported specifier ./add.wasm [451] ./math.js 5:0-37
[605] ./fibonacci.wasm 100 bytes (javascript) 67 bytes (webassembly) {451} [built]
[exports: fibonacci]
[all exports used]
harmony side effect evaluation ./fibonacci.wasm [451] ./math.js 3:0-45
harmony export imported specifier ./fibonacci.wasm [451] ./math.js 5:0-37
chunk {461} 461.output.js, 0fdec8168d54770f0f62.wasm 100 bytes (javascript) 41 bytes (webassembly) [rendered]
> ./add.wasm [144] ./example.js 1:0-20
[461] ./add.wasm 100 bytes (javascript) 41 bytes (webassembly) {451} {461} [built]
[exports: add]
import() ./add.wasm [144] ./example.js 1:0-20
harmony side effect evaluation ./add.wasm [451] ./math.js 1:0-33
harmony export imported specifier ./add.wasm [451] ./math.js 5:0-37
```

View File

@ -4,32 +4,32 @@ WebAssembly modules can be imported like other modules. Their download and compi
# example.js
``` javascript
{{example.js}}
```javascript
_{{example.js}}_
```
# math.js
``` javascript
{{math.js}}
```javascript
_{{math.js}}_
```
# dist/output.js
``` javascript
{{dist/output.js}}
```javascript
_{{dist/output.js}}_
```
# dist/183.output.js
# dist/451.output.js
``` javascript
{{dist/183.output.js}}
```javascript
_{{dist/451.output.js}}_
```
# dist/702.output.js
# dist/461.output.js
``` javascript
{{dist/702.output.js}}
```javascript
_{{dist/461.output.js}}_
```
# Info
@ -37,11 +37,11 @@ WebAssembly modules can be imported like other modules. Their download and compi
## Unoptimized
```
{{stdout}}
_{{stdout}}_
```
## Production mode
```
{{production:stdout}}
_{{production:stdout}}_
```

View File

@ -275,7 +275,7 @@ class Chunk {
* @param {ChunkSizeOptions} options options object
* @returns {number} total size of this chunk
*/
size(options) {
size(options = {}) {
const chunkGraph = ChunkGraph.getChunkGraphForChunk(this, "Chunk.size");
return chunkGraph.getChunkSize(this, options);
}

View File

@ -587,7 +587,7 @@ class ChunkGraph {
* @param {ChunkSizeOptions} options options object
* @returns {number} total size of the chunk
*/
getChunkSize(chunk, options) {
getChunkSize(chunk, options = {}) {
const cgc = this._getChunkGraphChunk(chunk);
const modulesSize = cgc.modules.getFromUnorderedCache(getModulesSize);
const chunkOverhead =
@ -608,7 +608,7 @@ class ChunkGraph {
* @param {ChunkSizeOptions} options options object
* @returns {number} total size of the chunk or false if chunks can't be integrated
*/
getIntegratedChunksSize(chunkA, chunkB, options) {
getIntegratedChunksSize(chunkA, chunkB, options = {}) {
const cgcA = this._getChunkGraphChunk(chunkA);
const cgcB = this._getChunkGraphChunk(chunkB);
const allModules = new Set(cgcA.modules);

View File

@ -211,6 +211,7 @@ class ExternalModule extends Module {
case "amd-require":
case "umd":
case "umd2":
case "system":
return getSourceForAmdOrUmdExternal(
chunkGraph.getModuleId(this),
this.isOptional(moduleGraph),

View File

@ -1581,7 +1581,14 @@ class JavascriptParser {
walkFunctionExpression(expression) {
const wasTopLevel = this.scope.topLevelScope;
this.scope.topLevelScope = false;
this.inScope(expression.params, () => {
const scopeParams = expression.params;
// Add function name in scope for recursive calls
if (expression.id) {
scopeParams.push(expression.id.name);
}
this.inScope(scopeParams, () => {
for (const param of expression.params) {
this.walkPattern(param);
}
@ -1765,7 +1772,14 @@ class JavascriptParser {
const args = options.map(renameArgOrThis);
const wasTopLevel = this.scope.topLevelScope;
this.scope.topLevelScope = false;
this.inScope(params.filter((identifier, idx) => !args[idx]), () => {
const scopeParams = params.filter((identifier, idx) => !args[idx]);
// Add function name in scope for recursive calls
if (functionExpression.id) {
scopeParams.push(functionExpression.id.name);
}
this.inScope(scopeParams, () => {
if (renameThis) {
this.scope.renames.set("this", renameThis);
}

View File

@ -170,6 +170,13 @@ class LibraryTemplatePlugin {
new JsonpExportMainTemplatePlugin(this.name).apply(compilation);
break;
}
case "system": {
const SystemMainTemplatePlugin = require("./SystemMainTemplatePlugin");
new SystemMainTemplatePlugin({
name: this.name
}).apply(compilation);
break;
}
default:
throw new Error(`${this.target} is not a valid Library target`);
}

View File

@ -0,0 +1,121 @@
/*
MIT License http://www.opensource.org/licenses/mit-license.php
Author Joel Denning @joeldenning
*/
"use strict";
const { ConcatSource } = require("webpack-sources");
const Template = require("./Template");
/** @typedef {import("./Compilation")} Compilation */
/**
* @typedef {Object} SystemMainTemplatePluginOptions
* @param {string=} name the library name
*/
class SystemMainTemplatePlugin {
/**
* @param {SystemMainTemplatePluginOptions} options the plugin options
*/
constructor(options) {
this.name = options.name;
}
/**
* @param {Compilation} compilation the compilation instance
* @returns {void}
*/
apply(compilation) {
const { mainTemplate, chunkTemplate } = compilation;
const onRenderWithEntry = (source, chunk, hash) => {
const externals = chunk.getModules().filter(m => m.external);
// The name this bundle should be registered as with System
const name = this.name ? `${JSON.stringify(this.name)}, ` : "";
// The array of dependencies that are external to webpack and will be provided by System
const systemDependencies = JSON.stringify(
externals.map(m =>
typeof m.request === "object" ? m.request.amd : m.request
)
);
// The name of the variable provided by System for exporting
const dynamicExport = "__WEBPACK_DYNAMIC_EXPORT__";
// An array of the internal variable names for the webpack externals
const externalWebpackNames = externals.map(
m => `__WEBPACK_EXTERNAL_MODULE_${Template.toIdentifier(`${m.id}`)}__`
);
// Declaring variables for the internal variable names for the webpack externals
const externalVarDeclarations =
externalWebpackNames.length > 0
? `var ${externalWebpackNames.join(", ")};`
: "";
// The system.register format requires an array of setter functions for externals.
const setters =
externalWebpackNames.length === 0
? ""
: Template.asString([
"setters: [",
Template.indent(
externalWebpackNames
.map(external =>
Template.asString([
"function(module) {",
Template.indent(`${external} = module;`),
"}"
])
)
.join(",\n")
),
"],"
]);
return new ConcatSource(
Template.asString([
`System.register(${name}${systemDependencies}, function(${dynamicExport}) {`,
Template.indent([
externalVarDeclarations,
"return {",
Template.indent([
setters,
"execute: function() {",
Template.indent(`${dynamicExport}(`)
])
])
]) + "\n",
source,
"\n" +
Template.asString([
Template.indent([
Template.indent([Template.indent([");"]), "}"]),
"};"
]),
"})"
])
);
};
for (const template of [mainTemplate, chunkTemplate]) {
template.hooks.renderWithEntry.tap(
"SystemMainTemplatePlugin",
onRenderWithEntry
);
}
mainTemplate.hooks.hash.tap("SystemMainTemplatePlugin", hash => {
hash.update("exports system");
if (this.name) {
hash.update(this.name);
}
});
}
}
module.exports = SystemMainTemplatePlugin;

Some files were not shown because too many files have changed in this diff Show More