使用模块捆绑与完整D3捆绑时,D3.v4强制图断开

问题描述 投票:1回答:1

我已经开始使用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));

抛出错误:“未捕获的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或汇总本身的问题?

javascript d3.js rollupjs
1个回答
1
投票

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

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

我自己不是一个大专家,但如果可以追踪断裂的实际部分会很有用。 “-c negate_iife = false”适用于其他模块捆绑,直到添加d3-force,或者至少在我看来。

© www.soinside.com 2019 - 2024. All rights reserved.