rna icon indicating copy to clipboard operation
rna copied to clipboard

Support dynamic imports

Open cowwoc opened this issue 1 year ago • 1 comments

I suspect this plugin might have a problem with dynamic imports. Given ThemeChooser.mts that contains:

const htmlAsString = await import("./ThemeChooser.html", {with: {type: "html"}}) as { default: string };

I get this esbuild output:

  target\classes\theme\ThemeChooser-QGTYAYZG.js    248.7kb
  target\classes\chunk-YEX2IMXM.js                   1.6kb
  target\classes\theme\ThemeChooser-R7JEJFRF.html    1.3kb
  target\classes\theme\ThemeChooser-YVQTYOLV.js      168b 

Looking on disk, ThemeChooser-QGTYAYZG.js is created and references ThemeChooser-YVQTYOLV.js but the latter file does not exist.

Do you have any idea why the file isn't being created? Maybe try adding a unit test for handling dynamic imports?

cowwoc avatar Oct 04 '24 12:10 cowwoc

Debugging this further, I am seeing the following:

The dynamic import is transformed into const htmlAsString = await import("./ThemeChooser-YVQTYOLV.js"); inside ThemeChooser-QGTYAYZG.js.

Notice that the original import was for an HTML file but the bundled version is now referring to a JS file. Next, the html file is actually being bundled... but it's called ThemeChooser-R7JEJFRF.html. So it looks like the generated import statement is simply referring to the wrong filename.

I'm not sure how to debug this further without your help...

cowwoc avatar Oct 04 '24 12:10 cowwoc