React NPM 包（Dragula）可用于开发但不能用于生产

Question

我已经用 React 15 和 Dragula 3.7.2 构建了一个不错的拖放，但是当我捆绑我的生产应用程序时，整个 dnd 事情不起作用，除非我能够提起单个元素但找不到将其放入的容器。

我正在为我的容器分配对我当前在 componentDidMount 中创建的 drake 实例的引用。

我已将多个 EventListener 分配给 drake 实例，但唯一触发的是“drag”-eventListener。 我在那里 console.logged drake 实例并看到我所有相关的容器都正确分配

我还认为 dragula 包可能会出现缩小失败，所以我使用了 cdn 中的版本

 class ProcessGridDrag extends React.Component { constructor() { super(); this.dragContext = null; this.dragContainers = []; } componentDidMount() { // eslint-disable-next-line no-undef this.drake = dragula(this.dragContainers, options); console.log('didMount'); console.log(this.drake.containers); this.drake.on('drop', this.onDropTile); this.drake.on('out', this.onOutContainer); this.drake.on('over', console.log); this.drake.on('drag', () => { debugger; console.log(this.drake); }); this.drake.on('shadow', console.log); // Override for touchmove for correct behaviour on iPad window.addEventListener('touchmove', () => {}); } componentWillUnmount() { this.dragContainers = []; console.log('will Unmount'); this.drake.containers = []; this.drake.off('drop', this.onDropTile); this.drake.off('out', this.onOutContainer); this.dragContext = null; this.drake.destroy(); } // This one is passed down to components which should act as a drag container dragulaDecorator = componentBackingInstance => { if ( componentBackingInstance && this.dragContainers.indexOf(componentBackingInstance) === -1 ) { this.dragContainers.push(componentBackingInstance); } };

webpack.config.prod: https://pastebin.com/BLu2hmmv webpack.config.dev: https://pastebin.com/3wczNisj

Answer 1

我的 css 有问题。 我已经覆盖了拖动元素的最高值。

由于生产中的 LoadOrder 不同，这个问题只发生在那里