Skip to content

Instantly share code, notes, and snippets.

Asset Size Chunks Chunk Names
0.9110a255e8cbd547adc7.js 311 bytes 0 [emitted]
...
// foo.js
import('./async-bar').then( a => console.log(a));
import('./async-baz').then( a => console.log(a));
// ...
Asset Size Chunks Chunk Names
0.612f1fa751a3287cf615.js 311 bytes 0 [emitted]
1.9606a5eadde08d70c763.js 311 bytes 1 [emitted]
...
// webpack.config.js
// ...
plugins: [
// ...
new webpack.NamedChunksPlugin((chunk) => {
if (chunk.name) {
return chunk.name;
}
return chunk.modules.map(m => path.relative(m.context, m.request)).join("_");
}),
Asset Size Chunks Chunk Names
async-bar.js.06896d922ee7bb8af159.js 324 bytes async-bar.js [emitted]
async-baz.js.fff77d118cec24487e5d.js 324 bytes async-baz.js [emitted]
main.16bb304a9926477df558.js 1.18 kB main [emitted] main
runtime.8f75ffddb5ac5820d4a9.js 6.01 kB runtime [emitted] runtime
vendor.73c86187abcdf9fd7b18.js 20.7 kB vendor [emitted] vendor
[./node_modules/preact/dist/preact.js] ./~/preact/dist/preact.js 20.5 kB {vendor} [built]
[./src/async-bar.js] ./src/async-bar.js 41 bytes {async-bar.js} [built]
[./src/async-baz.js] ./src/async-baz.js 41 bytes {async-baz.js} [built]
[./src/bar.js] ./src/bar.js 23 bytes {main} [built]
// webpack.config.js
// ...
externals: {
jquery: 'jQuery'
},
// ...
// before:
Asset Size Chunks Chunk Names
async-bar.js.06896d922ee7bb8af159.js 324 bytes async-bar.js [emitted]
async-baz.js.fff77d118cec24487e5d.js 324 bytes async-baz.js [emitted]
main.e4704e563c227ee88d16.js 1.21 kB main [emitted] main
runtime.6add1d75139c2dd504b1.js 6.01 kB runtime [emitted] runtime
vendor.73c86187abcdf9fd7b18.js 20.7 kB vendor [emitted] vendor
[./node_modules/preact/dist/preact.js] ./~/preact/dist/preact.js 20.5 kB {vendor} [built]
[./src/async-bar.js] ./src/async-bar.js 41 bytes {async-bar.js} [built]
// webpack.config.js
plugins: [
// ...
{
apply(compiler) {
compiler.plugin("compilation", (compilation) => {
compilation.plugin("before-module-ids", (modules) => {
modules.forEach((module) => {
if (module.id !== null) {
return;
Asset Size Chunks Chunk
async-bar.js.06896d922ee7bb8af159.js 324 bytes async-bar.js [emitted]
async-baz.js.fff77d118cec24487e5d.js 324 bytes async-baz.js [emitted]
main.8fad02c2ce285a92402a.js 1.52 kB main [emitted] main
runtime.a1ba8a5ef1cf9f245e87.js 6.01 kB runtime [emitted] runtime
vendor.12a52011916cc3cb208c.js 20.8 kB vendor [emitted] vendor
[./node_modules/preact/dist/preact.js] ./~/preact/dist/preact.js 20.5 kB {vendor} [built]
[./src/async-bar.js] ./src/async-bar.js 41 bytes {async-bar.js} [built]
[./src/async-baz.js] ./src/async-baz.js 41 bytes {async-baz.js} [built]
[./src/bar.js] ./src/bar.js 23 bytes {main} [built]
// webpack.config.js
// ...
entry: {
main: './src/foo',
other: './src/foo-two',
vendor: ['preact']
},
// ...