Errors importing ReactReorderable (ES6, Webpack)

[harel]

I'm using Webpack and the code is following the ES6 syntax. When importing:

import ReactReorderable from 'react-reorderable'

I get this when webpack tries to compile the bundles:

ERROR in ./~/react-reorderable/dist/react-reorderable.js
Module not found: Error: Cannot resolve module 'React' in /home/dev/app/node_modules/react-reorderable/dist
 @ ./~/react-reorderable/dist/react-reorderable.js 3:4-43

ERROR in ./~/react-reorderable/dist/react-reorderable.js
Module not found: Error: Cannot resolve module 'ReactDrag' in /home/dev/app/node_modules/react-reorderable/dist
 @ ./~/react-reorderable/dist/react-reorderable.js 3:4-43

Note that:

• react-reorderable is in node_moduels, and react-drag is in its node_module's dir as well.
• React is available, and everything else that uses it even in the same component I'm importing ReactReorderable. The compile errors come up when I import the object.
• I'm using React 0.13 if it matters
• Its installed via npm
• Same happens when installing via github.

Any ideas? so far this component works well both in browser and mobile browser. Can't say the same for react-dnd...

[oguzbilgic]

+1

[mgechev]

Here is what I tried without getting any errors:

mgechev → MinBook Pro ~/Desktop/reorderable Sat Oct 24 22:23:57
 $ npm install react-reorderable
react-reorderable@0.1.10 node_modules/react-reorderable
└── react-drag@0.1.5
mgechev → MinBook Pro ~/Desktop/reorderable Sat Oct 24 22:24:06
 $ vim
mgechev → MinBook Pro ~/Desktop/reorderable Sat Oct 24 22:24:22
 $ npm install react
react@0.14.0 node_modules/react
├── envify@3.4.0 (through@2.3.8, jstransform@10.1.0)
└── fbjs@0.3.2 (whatwg-fetch@0.9.0, ua-parser-js@0.7.9, loose-envify@1.1.0, promise@7.0.4, core-js@1.2.3)
mgechev → MinBook Pro ~/Desktop/reorderable Sat Oct 24 22:24:29
 $ vim test.js
mgechev → MinBook Pro ~/Desktop/reorderable Sat Oct 24 22:24:45
 $ babel-node test.js
Warning: require('react/addons') is deprecated. Access using require('react-addons-{addon}') instead.
{ [Function]
  displayName: 'ReactReorderable',
  propTypes:
   { onDragStart: { [Function] isRequired: [Function] },
     onDrag: { [Function] isRequired: [Function] },
     onDrop: { [Function] isRequired: [Function] },
     onChange: { [Function] isRequired: [Function] } },
  defaultProps:
   { onDragStart: [Function],
     onDrag: [Function],
     onDrop: [Function],
     onChange: [Function] } }
mgechev → MinBook Pro ~/Desktop/reorderable Sat Oct 24 22:27:08
 $ cat test.js
import ReactReorderable from 'react-reorderable';

console.log(ReactReorderable);

[wang3g]

+1. Having the same issue here. Still could not figure it out.

[mgechev]

Would you verify the issue is still reproducible? I changed the build completely.