React NPMパッケージ（Dragula）は開発中ではあるが生産中ではない

React 15とDragula 3.7.2で素敵なdrag'n Dropを構築しましたが、私のアプリケーションをプロダクション用にバンドルすると、私は単一の要素を持ち上げることができますが、それをドロップするコンテナは見つかりません。React NPMパッケージ（Dragula）は開発中ではあるが生産中ではない

私は現在componentDidMountで作成したdrakeインスタンスへの参照をコンテナに割り当てています。

私はdrakeインスタンスに複数のEventListenerを割り当てましたが、起動しているのは「drag'-eventListener」だけです。私はそこでドレイクインスタンスをconsole.loggedし、すべての私の関連するコンテナが正しく

を割り当て見た私はまた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

出典

2017-10-30 takethefake