webpack.config.js
module.exports = {
mode: 'development',
devtool: 'source-map',
entry: './src/main/index.js',
output: {
path: path.join(__dirname, 'dist'),
filename: 'bundle.js'
},
resolve: {
alias: {
app: [path.join(__dirname, 'src/main'), path.join(__dirname, 'src/foo')]
}
}
};index.js
import a from 'app/widgets/a';
import b from 'app/widgets/b';
import c from 'app/widgets/c';
console.log('\nstatic import\n');
a();
b();
c();
console.log('\ndynamic import\n');
const load = id => import(/* webpackMode: "eager" */ `app/widgets/${id}`);
load('a').then(ad => ad.default())
.then(() => load('b'))
.then(bd => bd.default())
.then(() => load('c'))
.then(cd => cd.default())
.catch(err => console.log(err));
Reproducible test repo - https://github.com/homobel/webpack5-dynamic-import
Ref: #9802 (comment)
webpack.config.js
index.js
Reproducible test repo - https://github.com/homobel/webpack5-dynamic-import
Ref: #9802 (comment)