导入“React-Magnific-Popup”包时出现错误“TypeError: Cannot read property 'object' of undefined”
Posted
技术标签:
【中文标题】导入“React-Magnific-Popup”包时出现错误“TypeError: Cannot read property \'object\' of undefined”【英文标题】：Get error "TypeError: Cannot read property 'object' of undefined" when import "React-Magnific-Popup" package导入“React-Magnific-Popup”包时出现错误“TypeError: Cannot read property 'object' of undefined” 【发布时间】：2018-10-21 20:04:57 【问题描述】：我正在使用 react-magnific-popup 包，但是当我从该包中导入任何内容时，我收到此错误“TypeError: Cannot read property 'object' of undefined”
./node_modules/react-magnific-popup/lib/SingleImage.js
node_modules/react-magnific-popup/lib/SingleImage.js:59
56 | exports.SingleImage = SingleImage;
57 |
58 | SingleImage.propTypes =
> 59 | config: _react2['default'].PropTypes.object.isRequired,
60 | className: _react2['default'].PropTypes.string.isRequired,
61 | href: _react2['default'].PropTypes.string.isRequired,
62 | children: _react2['default'].PropTypes.element.isRequired,
View compiled
__webpack_require__
/Users/user/Desktop/reactProjs/juz/webpack/bootstrap 9134a036f8ac4d969428: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
/Users/user/Desktop/reactProjs/juz/webpack/bootstrap 9134a036f8ac4d969428: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-magnific-popup/lib/ReactMagnificPopup.js
node_modules/react-magnific-popup/lib/ReactMagnificPopup.js:7
4 | value: true
5 | );
6 |
> 7 | var _SingleImage = require('./SingleImage');
8 |
9 | Object.defineProperty(exports, 'SingleImage',
10 | enumerable: true,
View compiled
__webpack_require__
/Users/user/Desktop/reactProjs/juz/webpack/bootstrap 9134a036f8ac4d969428: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
/Users/user/Desktop/reactProjs/juz/webpack/bootstrap 9134a036f8ac4d969428: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/pages/artistsPage/artists.js
http://localhost:3000/static/js/bundle.js:65258:79
__webpack_require__
/Users/user/Desktop/reactProjs/juz/webpack/bootstrap 9134a036f8ac4d969428: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
/Users/user/Desktop/reactProjs/juz/webpack/bootstrap 9134a036f8ac4d969428: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/App.js
http://localhost:3000/static/js/bundle.js:59016:85
__webpack_require__
/Users/user/Desktop/reactProjs/juz/webpack/bootstrap 9134a036f8ac4d969428: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
/Users/user/Desktop/reactProjs/juz/webpack/bootstrap 9134a036f8ac4d969428: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:62672:63
__webpack_require__
/Users/user/Desktop/reactProjs/juz/webpack/bootstrap 9134a036f8ac4d969428: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
/Users/user/Desktop/reactProjs/juz/webpack/bootstrap 9134a036f8ac4d969428: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:68288:18
__webpack_require__
/Users/user/Desktop/reactProjs/juz/webpack/bootstrap 9134a036f8ac4d969428: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
/Users/user/Desktop/reactProjs/juz/webpack/bootstrap 9134a036f8ac4d969428: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
我所做的只是将 Magnific Popup 导入某个组件，但正如我在此日志中看到的，错误出在包本身，或者我的应用程序可能不支持此包。
我该如何解决这个问题？
【问题讨论】：
【参考方案1】：我也面临同样的问题。我将按照以下步骤解决此问题。
1）安装道具类型；
2) 将 PropTypes 'var PropTypes = require('prop-types');' 声明到以下文件中。 i) SingleImage.js, LightBoxGallery.js, Popup.js.也替换
_react2['default'].PropTypes。进入 PropTypes。
适用于所有道具类型。 3) 重建您的项目.. 工作正常。
【讨论】：
以上是关于导入“React-Magnific-Popup”包时出现错误“TypeError: Cannot read property 'object' of undefined”的主要内容，如果未能解决你的问题，请参考以下文章