D3 V4.2.1 TypeScript Ошибка 2.0 импорта d3-selection-multi

Я пытаюсь импортировать d3 v4 в проект typescript, используя jspm и systemjs. Я могу правильно импортировать d3, используя этот

import * as d3 from 'd3';

Это работает, и это позволяет мне делать выборки и т.д. Я попытался использовать функцию attr и передал ей объект, который не работал. Я обнаружил, что d3 v4 включает это как отдельный модуль.

После загрузки этого модуля d3-selection-multi с jspm. Я пытаюсь импортировать его в свой проект так.

import * as d3 from 'd3';
import 'jspm_packages/npm/d3-selection-multi@1.0.0';

Затем я пытаюсь использовать функцию attrs, но консоль регистрирует следующую ошибку

(индекс): 40 Ошибка: (SystemJS) d3.selectAll(...). data (...). style (...). attrs не является функцией (...)

Я также получаю некоторую ошибку компиляции, которую я получаю все время, но все же они все еще компилируются и код запускает

error TS2307: Cannot find module 'd3'
error TS1110: Type expected

Может ли кто-нибудь объяснить, что я делаю неправильно, и предложить решение?

3 ответа

Мне пришлось создать файл "bundle" и импортировать его вместо импорта отдельных пакетов d3. Это, вероятно, не идеально, но он работает (я прокомментировал пакеты, которые мне не нужны, чтобы сэкономить на пространстве):

// export * from 'd3-array';
// export * from 'd3-axis';
// export * from 'd3-brush';
// export * from 'd3-chord';
// export * from 'd3-collection';
// export * from 'd3-color';
// export * from 'd3-dispatch';
// export * from 'd3-drag';
// export * from 'd3-dsv';
// export * from 'd3-ease';
// export * from 'd3-force';
// export * from 'd3-format';
// export * from 'd3-geo';
// export * from 'd3-hierarchy';
// export * from 'd3-interpolate';
// export * from 'd3-path';
// export * from 'd3-polygon';
// export * from 'd3-quadtree';
// export * from 'd3-queue';
// export * from 'd3-random';
// export * from 'd3-request';
// export * from 'd3-scale';
export * from 'd3-selection';
export * from 'd3-selection-multi';
export * from 'd3-shape';
// export * from 'd3-time';
// export * from 'd3-time-format';
// export * from 'd3-timer';
// export * from 'd3-transition';
// export * from 'd3-voronoi';
// export * from 'd3-zoom';

Чтобы использовать это, мне просто нужно:

import * as D3 from './d3.bunde.ts';

P.S. Наверное, не имеет значения, но я строю свой проект с помощью angular -cli.


Следующее должно работать

import * as d3 from 'd3';
 import 'd3-selection-multi';


Рабочий пример jspm + d3-selection-multi ": https://github.com/jakeNiemiec/jspm_d3

Если вам нужно импортировать все D3, используйте jspm install npm:d3. Это добавит немного раздувания. Помните, что jspm поставляется с rollup, взглянуть на сборку script в package.json.

licensed under cc by-sa 3.0 with attribution.