Given this code:

// a.js
console.log('a');

// b.js
console.log('b');

// index.js
async function onButtonClick() {
  await import('./a.js') 
  await import('./b.js')
}

Where we mark b.js as external, the bundler prints this:

• dynamically imports "b" => console logs "b"
• User clicks on button
• dynamically imports "a" => console logs "a"

It should rather be:

• User clicks on button
• dynamically imports "a" => console logs "a"
• dynamically imports "b" => console logs "b"

Webpack hoists all external dynamic imports to the very top, not making it dynamic import. Which defeats its purpose.

{
  mode: "production",
  externalsType: 'module'
  externals: {
    /b.js/i,
  },
  output: {
    chunkFormat: 'module',
    chunkLoading: 'import',
    module: true
  }
}

It would be great if Webpack does not wrap native ESM imports with promises as well.

Other relevant information:
"webpack": "5.89.0",
"webpack-cli": "5.1.4",
"webpack-dev-server": "4.15.1",