React 0.14.2 错误 - 超级表达式必须为空或函数

Question

从 0.13.2 更新到 0.14.2 后出现此错误：

Uncaught TypeError: Super expression must either be null or a function, not object

已经有个关于这个的。最常见的错误是拼写错误 React.component（没有大写 C）。另一个尝试使用版本 < 0.13.

的 ES6 classes

但我已经成功地将 ES6 classes 与 React 0.13.x 一起使用，而且我到处都使用大写字母 C，并且日志记录 React.Component 似乎给出了适当的结果（函数ReactComponent(...))

经过一番搜索后，我制作了这 3 个测试用例，其中 2 个抛出完全相同的错误（但我不明白为什么），而一个则没有。似乎暗示 classes 出现的顺序是个问题？

测试 1（抛出错误）

//Test.jsx
var React = require('react');
var ReactDOM = require('react-dom');
var BaseComponent = require('./BaseComponent');

class Test extends BaseComponent {
    render() { return <div>Test worked</div>; }
}
ReactDOM.render(<Test />, document.getElementById('test'));

//BaseComponent.jsx
var React = require('react');
console.log(React.Component); // <--- logs "function ReactComponent(...)" !!
export default class BaseComponent extends React.Component { }

TEST 2（把BaseComponent放在Test.jsx下面，还是报错）

//Test.jsx
var React = require('react');
var ReactDOM = require('react-dom');
class Test extends BaseComponent { render() { return <div>Test worked</div>;     } }
class BaseComponent extends React.Component { }
ReactDOM.render(<Test />, document.getElementById('test'));

TEST 3（把BaseComponent放在Testclass定义上面，没报错！？）

//Test.jsx
var React = require('react');
var ReactDOM = require('react-dom');
class BaseComponent extends React.Component { }
class Test extends BaseComponent { render() { return <div>Test worked</div>;     } }
ReactDOM.render(<Test />, document.getElementById('test'));

我什至不确定这是否能解决我的实际问题。但是了解这些测试用例中发生的事情可能会帮助我找到解决方案。

我正在使用带有 babel 的 webpack 编译成一个包。

更新改变

export default class BaseComponent extends React.Component { }

到

class BaseComponent extends React.Component { }
module.exports = BaseComponent;

错误也去掉了！这意味着我现在要重构它，但这并不能解决问题，因为 export default class 应该可以正常工作

Answer 1

我刚才遇到了类似的问题，删除 node_modules 文件夹并重新安装所有对我有用的东西，也许你可以试试？

Answer 2

我找到了解决方案。这是因为 babel 发生了变化，我也更新了它。如果您使用：

export default class BaseComponent

您还需要使用 import 而不是 require，所以：

import BaseComponent from './BaseComponent'

而不是

var BaseComponent = require('./BaseComponent')

使用这个正则表达式替换了所有地方：替换：var ([\w-_]+?) = require\('([\w-_.\/]+?)'\); 与：import from '';

React 0.14.2 错误 - 超级表达式必须为空或函数

React 0.14.2 error - Super expression must either be null or a function

javascript

ecmascript-6

reactjs

webpack

babeljs