How to dynamically import d3?

Question

I know that modules can normally be dynamically imported with the following syntax (source):

if (condition) {
    import('something')
    .then((something) => {
       console.log(something.something);
    });
}

However, the d3 library has to be imported with this syntax, not the normal import syntax:

import * as d3 from "d3";

How do I combine the two of these to dynamically import the d3 library in an ES6 environment?

[Some information on MDN which may help](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/import#import_a_module_for_its_side_effects_only) — Andy, Dec 10 '22 at 23:02
Thanks a ton, guess I completely missed that part until you pointed it out again @Andy — Aaron Meese, Dec 10 '22 at 23:15

score 2 · Accepted Answer · answered Dec 10 '22 at 23:15

Thanks to Andy, I discovered that my desired behavior is already happening behind the scenes!

It returns a promise which fulfills to an object containing all exports from moduleName, with the same shape as a namespace import (import * as name from moduleName): a sealed object with null prototype.

Hope this can help someone else, cheers!

How to dynamically import d3?

1 Answers1