[BUG] Resolve dynamic imports

[jaschaio]

Bug Report Quick Checklist

• snowpack: 3.1.2
• npm: 6.14.11
• OS: macOS Catalina 10.15.7
• node: 14.14.0

Describe the bug

Snowpack doesn't resolve dynamic imports:

import { library, icon } from '@fortawesome/fontawesome-svg-core';

const getIcon = async ( { icon: iconToFetch } ) => {

    const { [ iconToFetch ]: importedIcon } = await import( `@fortawesome/free-brands-svg-icons/${ iconToFetch }.js` );

    library.add( importedIcon );

    return icon( importedIcon, { classes } ).html

}

( async () => {

    const html = await getIcon( { icon: 'faFacebook' } );

    document.body.innerHTML = html;

} )();

Throws Uncaught (in promise) TypeError: Failed to resolve module specifier '@fortawesome/free-brands-svg-icons/faFacebook.js'

To Reproduce

Reproducible example: https://gist.github.com/jaschaio/321e794e7f8fb15d4bf9dfa0da46656c

Expected behavior

I would expect snowpack to notice the dynamic import, and replace the module identifier with the build output directory.

[amankkg]

This is more likely to be related to esbuild rather than snowpack. Here is some discussion going on https://github.com/evanw/esbuild/issues/700

TL;DR dynamic imports isn't something esbuild gonna support out of the box

[drwpow]

This does seem to be a bug; thanks for filing! Will investigate.

[PeterPanZH]

It seems that snowpack won't resolve the path when dynamic import has a variable in it. Any update?

[IanVS]

This seems related to https://github.com/snowpackjs/snowpack/issues/2861, right?

[PeterPanZH]

This seems related to #2861, right?

Ah, right! This feature will solve the problem.

[IanVS]

@drwpow I think this can be closed as a duplicate.

[aneta-kjeldsen]

I'm expiriencing exactly the same thing. Any progress on this issue?