不理解 React / WebPack 中的这个错误是什么意思

Question

所以我正在尝试将现有的静态站点 Material Design Lite 移动到 React 中。

我使用 Create-React-App 包来创建一个新的 React 应用程序。我运行命令 "npm i 'material-design-lite' --save" - 这两个都有效。

现在，在我的 App.JS 文件中导入它。

import componentHandler from 'material-design-lite';

class App extends Component {

   componentDidMount() {
    componentHandler.upgradeAllRegistered();
  }

当我这样做时，出现此错误

TypeError: __WEBPACK_IMPORTED_MODULE_2_material_design_lite___default.a.upgradeAllRegistered is not a function

它在 componentHandler.upgradeAllRegistered();

行抱怨

问题是这个功能确实存在。我在调试时可以访问它，我也可以在chrome控制台中访问它。

这个错误是什么意思？

Answer 1

此库未准备好用作 es6 模块。您的导入语句导入一个空对象，因为 material-design-lite 不导出任何内容。

您可以像这样导入模块：

import 'material-design-lite';

这会将 componentHandler 对象附加到 window 对象。您可以通过 window.componentHandler 访问它。您只需确保在应用程序中的任何位置访问它之前执行导入。

不理解 React / WebPack 中的这个错误是什么意思

Not understanding what this error in React / WebPack mean

reactjs

webpack

material-design-lite