Dynamic Import Expressions

Dynamic import expressions are a new feature and part of ECMAScript that allows users to asynchronously request a module at any arbitrary point in your program.

This means that you can conditionally and lazily import other modules and libraries.For example, here’s an async function that only imports a utility library when it’s needed:

  1. async function getZipFile(name: string, files: File[]): Promise<File> {
  2. const zipUtil = await import('./utils/create-zip-file');
  3. const zipContents = await zipUtil.getContentAsBlob(files);
  4. return new File(zipContents, name);
  5. }

Many bundlers have support for automatically splitting output bundles based on these import expressions, so consider using this new feature with the esnext module target.