2016-05-04 4 views
7

Ich experimentiere mit dem Alpha von d3 v4.0 und versuche, einen benutzerdefinierten Build innerhalb eines jspm-Setups zu erstellen. Ich kann nicht verstehen, wie der neue modulare Aufbau funktionieren soll.d3 v4.0 custom build mit ES6-Modulen

Wenn ich einen benannten Export von einem Modul importieren möchte, dh json von d3-request, kann ich folgendes tun: import {json} from "d3-request"; nachdem ich das Modul über jspm/npm installiert habe.

Wenn ich die ganze Bibliothek installiert werden soll, ebenfalls import d3 from "d3";

Wenn ich mehrere Module und benannte Exporte und haben sie alle mir zur Verfügung stehenden unter dem d3 Namensraum installiert werden soll (dh Import d3-Form neben D3- Anfrage, und Zugriff auf d3.json und d3.line in der gleichen d3 global), was ist die richtige Syntax dafür?

Ich weiß, dass bei der Verwendung von Standalone-Versionen dieser Module Globals wie d3_shape exportiert werden. Ist es beabsichtigt, für jedes Modul separate Namensräume zu haben, wenn diese Module mit meiner Anwendung gebündelt werden?

Antwort

7

ich glauben, dass der Plan ist ein ES6 Build der gesamten Bibliothek bieten einmal D3 4.0 abgeschlossen ist, zusammen mit einem benutzerdefinierten Build-Generator, an welcher Stelle Sie in der Lage sein wird, dies zu tun:

import { json, line } from 'd3'; 

json('file.json', (err, data) => ...); 

(Beachten Sie, dass keine d3 Variable gibt es, wenn Sie dies tun -. Sie die genannten Einfuhren direkt verwenden)

Derzeit ist die d3 Paket ist die Version 3, die so keine ES6 Build haben, in der Zwischenzeit gibt es zwei Optionen - Installieren Sie die benötigten Module und importieren Sie sie von ihnen einzeln ...

import { json } from 'd3-request'; 
import { line } from 'd3-shape'; 

json('file.json', (err, data) => ...); 

... oder eigene Build erstellen:

// src/my-d3.js 
export { json } from 'd3-request'; 
export { line } from 'd3-shape'; 

// src/app.js 
import { json, line } from './my-d3.js'; 

Von denen ich die ersten bevorzugen würde - es ist expliziter und möglicherweise weniger wahrscheinlich Ursache unbenutzter Code, der in deinem Build endet.

+0

Super, danke für die Klärung der verfügbaren Ansätze! Hier hofft man auf den vollen ES6-Build. – amigolargo

+1

D3 4.0 ist out. [Demo] (https://bl.ocks.org/mbstock/bb09af4c39c79cffcde4) – vsync

+0

Möchten Sie diese Antwort aktualisieren? – ksav