dynamic import with vars help

[The-Code-Monkey]

Hi There, loving the speed of esbuild but im having an issue with my dynamic import that has variables in it.

export const getIcon = (name: IconTypes) => {
  return lazy(() => import(`./icons/${name}`));
};

so the icons folder never gets generated in my repo so this fails, which breaks the icon component completely.

Is there any way to get this to import correctly.

[hyrious]

Dynamic import/require calls cannot be statically analysed, so esbuild cannot find corresponding files to bundle them. You can instead manually write them down:

const Icons = {
  name1: () => import('./icons/name1'),
};
export const getIcon = (name: IconTypes) => {
  return lazy(Icons[name]);
};

[The-Code-Monkey]

@hyrious Yeah problem with that is there is like 300 icons so not really a good thing to do.

i did fix it by doing this

const getEntryPoint = () => new Promise<Array<string>>((resolve) => {
        glob("./src/**/*.ts*x").then(res => resolve(res.filter(filename => !filename.includes("__"))));
    })

    return {
        splitting: true,
        tsconfig: paths.tsconfigJson, // default
        entryPoints: await getEntryPoint(),
        outdir: 'dist',
        format: "esm",
        minify: shouldMinify,
    }

problem is now my .d.ts file arent generating for some reason.

[evanw]

Run-time file system emulation like this is out of scope, which is documented here: https://esbuild.github.io/api/#non-analyzable-imports. Closing this issue as out of scope.