Интегрировать d3-облако с накопительным пакетом (собственно Svelte)
У меня есть следующий проект Svelte 3, использующий облако d3. Я включаю его в index.html перед головным концом следующим образом:
<script src="https://d3js.org/d3.v3.min.js"></script>
<script src="https://rawgit.com/jasondavies/d3-cloud/master/build/d3.layout.cloud.js"></script>
</head>
Я хотел бы удалить любую ссылку на него в моем index.html и включить его в npm, например так:
npm install d3 d3-cloud
У меня есть функция js, которая ссылается на d3 и d3.layout.cloud()
Я попытался прокомментировать ссылку на d3 в моем index.html, а затем:
import * as d3 from 'd3'
import * as d3cloud from 'd3-cloud'
Тем не менее я все еще получаю это сообщение от накопительного пакета:
(!) Missing exports
https://rollupjs.org/guide/en/#error-name-is-not-exported-by-module
src\lib\wordCloud.js
scale is not exported by node_modules\d3\index.js
20: function __wordCloud(selector, width = 500, height = 500) {
21:
22: const fill = d3.scale.category20();
^
23:
24: d3.select(selector).selectAll("*").remove();
src\lib\wordCloud.js
layout is not exported by node_modules\d3\index.js
71: // of the wordCloud return value.
72: update: function(words) {
73: d3.layout.cloud().size([width, height])
^
74: .words(words)
75: .padding(5)
src\lib\wordCloud.js
И когда я запускаю код, я получаю эту ошибку на консоли браузера:
TypeError: undefined is not a function wordCloud.js:22:17
__wordCloud wordCloud.js:22
wordCloud wordCloud.js:11
[...]
Я также попытался добавить это в свой rollup.config.js, но я думаю, что это не то, что я собираюсь сделать (я не хочу, чтобы он был внешним ресурсом, а был включен в мой bundle.js)
[...]
name: 'app',
file: 'public/bundle.js',
globals: { 'd3': 'd3' },
external: ['d3']
},
plugins: [
[...]
Я бы хотел, чтобы накопительный пакет обрабатывал мои зависимости внешнего интерфейса (например, d3 и d3-cloud) и включал их в мой bundle.js (я до сих пор не совсем понимаю, как работать с пакетами для зависимостей внешнего интерфейса)
как мне это сделать?