Cannot read property 'number' of undefined Error

[kit426]

I'm trying to add motionmenu to a new react project. When I add the following I get the following error. I've tried the both versions 0.3.0 and the latest but both give the same error. Am I doing something wrong?

<MotionMenu type="circle" margin={120} y={0} x={0} > <div className="button"><i className="fa fa-bars" /></div> <div className="button"><i className="fa fa-cogs" /></div> <div className="button"><i className="fa fa-cloud" /></div> <div className="button"><i className="fa fa-home" /></div> <div className="button"><i className="fa fa-flash" /></div> <div className="button"><i className="fa fa-heart" /></div> <div className="button"><i className="fa fa-globe" /></div> <div className="button"><i className="fa fa-plug" /></div> </MotionMenu>

ERROR:
×
TypeError: Cannot read property 'number' of undefined
./node_modules/react-motion-menu/lib/item.js
C:/Users/Kristen/Desktop/Temp Pull From External Drive/Projects/WebApplication_SS/WebApplication_SS/react-app/node_modules/react-motion-menu/lib/item.js:165
162 |
163 |
164 | MenuItem.propTypes = {

165 | x: _react.PropTypes.number.isRequired,
166 | y: _react.PropTypes.number.isRequired,
167 | direction: _react.PropTypes.oneOf(['vertical', 'horizontal']).isRequired,
168 | distance: _react.PropTypes.number.isRequired,
View compiled
webpack_require
http://localhost:3000/static/js/bundle.js:679:30
676 | // };
677 | //
678 | // // Execute the module function
679 | // modules[moduleId].call(module.exports, module, module.exports, hotCreateRequire(moduleId));
| ^ 680 | //
681 | // // Flag the module as loaded
682 | /******/ module.l = true;
View source
fn
C:/Users/Kristen/Desktop/Temp Pull From External Drive/Projects/WebApplication_SS/WebApplication_SS/react-app/webpack/bootstrap c756a603d86a7ec04051:88
85 | console.warn("[HMR] unexpected require(" + request + ") from disposed module " + moduleId);
86 | hotCurrentParents = [];
87 | }
88 | return webpack_require(request);
89 | };
90 | var ObjectFactory = function ObjectFactory(name) {
91 | return {
View compiled
./node_modules/react-motion-menu/lib/index.js
C:/Users/Kristen/Desktop/Temp Pull From External Drive/Projects/WebApplication_SS/WebApplication_SS/react-app/node_modules/react-motion-menu/lib/index.js:15
12 |
13 | var _reactMotion = require('react-motion');
14 |
15 | var _item = require('./item');
16 |
17 | var _item2 = _interopRequireDefault(_item);
18 |
View compiled
webpack_require
C:/Users/Kristen/Desktop/Temp Pull From External Drive/Projects/WebApplication_SS/WebApplication_SS/react-app/webpack/bootstrap c756a603d86a7ec04051:678
675 | };
676 |
677 | // Execute the module function
678 | modules[moduleId].call(module.exports, module, module.exports, hotCreateRequire(moduleId));
679 |
680 | // Flag the module as loaded
681 | module.l = true;
View compiled
fn
C:/Users/Kristen/Desktop/Temp Pull From External Drive/Projects/WebApplication_SS/WebApplication_SS/react-app/webpack/bootstrap c756a603d86a7ec04051:88
85 | console.warn("[HMR] unexpected require(" + request + ") from disposed module " + moduleId);
86 | hotCurrentParents = [];
87 | }
88 | return webpack_require(request);
89 | };
90 | var ObjectFactory = function ObjectFactory(name) {
91 | return {
View compiled
./src/containers/app/index.js
http://localhost:3000/static/js/bundle.js:65989:76
webpack_require
C:/Users/Kristen/Desktop/Temp Pull From External Drive/Projects/WebApplication_SS/WebApplication_SS/react-app/webpack/bootstrap c756a603d86a7ec04051:678
675 | };
676 |
677 | // Execute the module function
678 | modules[moduleId].call(module.exports, module, module.exports, hotCreateRequire(moduleId));
679 |
680 | // Flag the module as loaded
681 | module.l = true;
View compiled
fn
C:/Users/Kristen/Desktop/Temp Pull From External Drive/Projects/WebApplication_SS/WebApplication_SS/react-app/webpack/bootstrap c756a603d86a7ec04051:88
85 | console.warn("[HMR] unexpected require(" + request + ") from disposed module " + moduleId);
86 | hotCurrentParents = [];
87 | }
88 | return webpack_require(request);
89 | };
90 | var ObjectFactory = function ObjectFactory(name) {
91 | return {
View compiled
./src/index.js
http://localhost:3000/static/js/bundle.js:66514:74
webpack_require
C:/Users/Kristen/Desktop/Temp Pull From External Drive/Projects/WebApplication_SS/WebApplication_SS/react-app/webpack/bootstrap c756a603d86a7ec04051:678
675 | };
676 |
677 | // Execute the module function
678 | modules[moduleId].call(module.exports, module, module.exports, hotCreateRequire(moduleId));
679 |
680 | // Flag the module as loaded
681 | module.l = true;
View compiled
fn
C:/Users/Kristen/Desktop/Temp Pull From External Drive/Projects/WebApplication_SS/WebApplication_SS/react-app/webpack/bootstrap c756a603d86a7ec04051:88
85 | console.warn("[HMR] unexpected require(" + request + ") from disposed module " + moduleId);
86 | hotCurrentParents = [];
87 | }
88 | return webpack_require(request);
89 | };
90 | var ObjectFactory = function ObjectFactory(name) {
91 | return {
View compiled
0
http://localhost:3000/static/js/bundle.js:66776:18
webpack_require
C:/Users/Kristen/Desktop/Temp Pull From External Drive/Projects/WebApplication_SS/WebApplication_SS/react-app/webpack/bootstrap c756a603d86a7ec04051:678
675 | };
676 |
677 | // Execute the module function
678 | modules[moduleId].call(module.exports, module, module.exports, hotCreateRequire(moduleId));
679 |
680 | // Flag the module as loaded
681 | module.l = true;
View compiled
./node_modules/ansi-regex/index.js.module.exports
C:/Users/Kristen/Desktop/Temp Pull From External Drive/Projects/WebApplication_SS/WebApplication_SS/react-app/webpack/bootstrap c756a603d86a7ec04051:724
721 | webpack_require.h = function() { return hotCurrentHash; };
722 |
723 | // Load entry module and return exports
724 | return hotCreateRequire(0)(webpack_require.s = 0);
725 |
726 |
727 |
View compiled
(anonymous function)
http://localhost:3000/static/js/bundle.js:728:10
This screen is visible only in development. It will not appear if the app crashes in production.
Open your browser’s developer console to further inspect this error.

[dandonahoe]

I'm getting the same thing. Currently running react 16.1.0

[NCarteazy]

Same here as well. This only occurred after moving to React 16.

[Nyura95]

idem for me, react 16.1.0

i remove manually the props required and it's working for me. by hearing the fix ^^

[jordancoil]

I think this is because React.PropTypes has moved to a different package since 15.5.
It says to use https://www.npmjs.com/package/prop-types instead.