奇怪的 React.createElement 错误（不变违规）

Question

在 mocha 中测试我的组件时，我遇到了一个我无法解释的错误。相关代码为：

  console.error('Index', Index, typeof Index);
  let ind = TestUtils.renderIntoDocument(<Index />);

正在生产：

错误：'索引'，函数索引（） { ... }，'函数'

错误：'警告：React.createElement：类型无效 - 需要一个字符串（对于内置组件）或一个类/函数（对于复合组件）但得到：对象。您可能忘记从定义组件的文件中导出组件。检查Index 的渲染方法。'

所以第一行Index 似乎是一个函数，而在下一行，它现在是一个对象。

我以前从未见过这种错误，而且我这辈子都无法开始猜测是什么原因造成的。我正在使用 webpack 和 react-router，但我不确定它们与这个错误有什么关系（同样的设置以前从未导致过这种错误）。

什么可能导致我的组件类型从一行更改为下一行？或者至少，是什么导致 React.createElement 认为它已经改变了？

编辑：

发现错误。错误不在Index.jsx 中，错误似乎暗示了这一点。错误出现在 Index 在其渲染方法中导入和渲染的组件中。

Answer 1

大多数情况下（对我来说很好）是因为您没有正确导出/导入。

常见错误（对我而言）：

// File: LeComponent.js
export class LeComponent extends React.Component { ... }

// File: App.js
import LeComponent from './LeComponent';

// no "default" export, should be  export default class LeComponent

有几种方法可能是错误的，但该错误是因为 60% 的时间每次都存在导入/导出错误。