d3.event 在 webpack 构建中为空

Question

我有一个有效的 D3/React/Webpack 系统，我试图通过不导入所有 D3 来减小构建大小。所以我有一个 d3Import.js 文件：

import { select, event } from 'd3-selection';
import { drag } from 'd3-drag';

export default { select: select, drag: drag, event: event };

这被引用了

import d3 from '../../d3Import.js';

除了在例如拖动事件。

onDrag = () => {
    const targetY = d3.event.y;

这失败了

TypeError：_d3Import2.default.event 为空

我在阅读建议here时尝试为事件使用不同的名称

import { select, event as currentEvent } from 'd3-selection';

...但没有变化。这一切都过去了

import * as d3 from 'd3;

但这似乎意味着 bundle.js 中额外增加了 100k 左右。任何帮助表示赞赏！

Answer 1

感谢 Terry 的评论，我有来自 here 的解决方案：

onDrag = () => {
   d3.getEvent = () => require("d3-selection").event;
   const targetY = d3.getEvent().y;
}