I'm experimenting with the alpha of d3 v4.0, and attempting to create a custom build, within a jspm setup. I can't seem to get my head around how the new modular build is intended to work.
If I want to import a named export from a module, ie json from d3-request, I can do the following:
import {json} from "d3-request"; after having installed the module via jspm/npm.
If I want to install the whole library, likewise import d3 from "d3";
If I want to install multiple modules and named exports and have them all available to me under the d3 namespace (ie, importing d3-shape alongside d3-request, and having access to d3.json and d3.line in the same d3 global), what is the correct syntax for this?
I realise that when using standalone versions of these modules globals such as d3_shape are exported. Is this the intention, to have separate namespaces for each module when bundling these modules with my application?
I believe the plan is to offer an ES6 build of the entire library once D3 4.0 is finished, along with a custom build generator, at which point you'll be able to do this:
import { json, line } from 'd3';
json( 'file.json', ( err, data ) => ... );
(Note that there's no d3 variable when you do this – you use the named imports directly.)
Currently, the d3 package is version 3, which doesn't have an ES6 build, so in the meantime there are two options – install the modules you need and import from them individually...
import { json } from 'd3-request';
import { line } from 'd3-shape';
json( 'file.json', ( err, data ) => ... );
...or create your own custom build:
// src/my-d3.js
export { json } from 'd3-request';
export { line } from 'd3-shape';
// src/app.js
import { json, line } from './my-d3.js';
Of those, I'd favour the first – it's more explicit, and possibly less likely to cause unused code to end up in your build.