Question

我喜欢摆弄D3力导向图，例如： D3.v4中的https://bl.ocks.org/mbostock/4062045。一切正常，最新完整的D3版本/捆绑包。

我想减少加载的JS库的大小，因此最终使用基于汇总的https://www.npmjs.com/package/d3-v4-bundler。我所有其他不相关的D3.v4图表与汇总捆绑的“精选”模块和方法配合得很好，但d3-force出了问题。

在尝试使用d3-force方法的代码中已经很早了：

var simulation = d3.forceSimulation()
  .force("link", d3.forceLink().id(function (d) { return d.id; }))
  .force("charge", d3.forceManyBody())
  .force("center", d3.forceCenter(svgwidth / 2, svgheight / 2));

抛出错误：“Uncaught TypeError：无法读取未定义的属性'force'”。

我在d3-v4-bundler中尝试了几乎所有模块和方法的组合，但只有当我从“d3”导出所有东西时，即使用整个东西，力导向图才有效。即使单独捆绑所有模块也不起作用。据我所知，“d3-force”本身需要“d3-collection”，“d3-dispatch”，“d3-quadtree”和“d3-timer”，但这些都是通过d3-v4-bundler正确捆绑的。

是否可能还有一些其他（外部？）对“d3-force”的重要依赖可能会在捆绑过程中丢失，导致d3.forceSimulation（）。force to break？或者这可能是一个根植于d3-v4-bundler或汇总本身的问题？

Answer 1

找到了我的问题的答案，但没有找到背后的原因。

由于某种原因，只有d3-force的某些内容或我选择的d3模块中的组合内容在d3-v4-bundler中以一种打破“强制”decleration的方式与Uglifyjs缩小。从d3-v4-bundler的uglifyjs命令中删除“-c negate_iife = false”参数时，即使缩小的代码也适用于使用d3-force生成的图形。当然，最小化率并不是那么好，但显然价值合并中的某些东西会破坏。

我自己并不是一个大专家，但如果可以追踪断裂的实际部分，那将会非常有用。 “-c negate_iife = false”对其他模块捆绑工作正常，直到添加了d3-force，或者至少在我看来这样。

使用模块捆绑与完整D3捆绑

1 个答案: