Javascript 将d3云与rollup集成（实际上更苗条）

我有以下使用d3云的苗条3项目。我将其包含在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>

npm install npm i d3@3 d3-cloud

这就是我在package.json中得到的

  "dependencies": {
    "d3": "^3.5.17",
    "d3-cloud": "^1.2.5",
    "sirv-cli": "^0.4.4"
  },

我有一个引用d3和d3.layout.cloud（）的js函数

我尝试在index.html中注释对d3的引用，然后：

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
select is not exported by node_modules\d3\d3.js
25:   const fill = d3.scale.category20();
26:
27:   d3.select(selector).selectAll("*").remove();
         ^
28:
29:   //Construct the word cloud's SVG element
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: this is undefined d3.js:8:20
    d3 d3.js:8
    d3 d3.js:9554
    createCommonjsModule bundle.js:402
    app bundle.js:405
    <anonymous> bundle.js:10424
[...]

我想让rollup处理我的前端依赖项（如d3和d3 cloud），并将它们包含在bundle.js中（我仍然不太了解如何使用前端依赖项的捆绑程序）

---

我该怎么做？

错误是什么？抱歉，我添加了有关错误的更多信息。您的html脚本标记src似乎指向了d3的版本3。而当您使用

npmid3

安装时，它将安装版本5，该版本具有不同的api。您可以尝试使用

npmi安装版本3d3@3

或升级您的代码以使用版本5。非常感谢您的回复，我用d3@3但是看起来我还是遇到了同样的错误，我可能是错的，但是看起来输出中有

external

，应该是顶级的。

[...]
    name: 'app',
    file: 'public/bundle.js',
    globals: { 'd3': 'd3' },
    external: ['d3']
  },
  plugins: [
[...]