[解決済み] ReactJS giving error Uncaught TypeError: Super expression は null か関数でなければならず、undefined ではありません。

質問

ReactJSを使用しています。

下のコードを実行すると、ブラウザはこう言います。

Uncaught TypeError: Super expression は null か関数でなければならず、undefined ではありません。

何が問題なのか、少しでもヒントがあればありがたいのですが。

まず、コンパイルに使用した行です。

browserify -t reactify -t babelify examples/temp.jsx  -o examples/public/app.js

そして、そのコード。

var React = require('react');

class HelloMessage extends React.Component {
  render() {
    return <div>Hello </div>;
  }
}

UPDATE この問題で3日間地獄の炎に焼かれた後、私はreactの最新バージョンを使っていないことを発見しました。

グローバルにインストールします。

sudo npm install -g [email protected]

をローカルにインストールします。

npm install [email protected]

ブラウザのバージョンも正しくしてください。

<script type="text/javascript" src="react-0.13.2.js"></script>

これで誰かの3日間の貴重な命が救われることを祈っています。

解決するには？

クラス名

まず、正しい名前のクラスから拡張していることが確実な場合、例えば、以下のようになります。 React.Component React.componentやReact.createComponentではなく、Reactのバージョンアップが必要な場合があります。拡張するクラスの詳細については、以下の回答を参照してください。

Reactのアップグレード

Reactはバージョン0.13.0以降、ES6スタイルのクラスのみをサポートしています（サポート導入に関する公式ブログポストを参照）。 こちら .

その前に、使用する場合。

class HelloMessage extends React.Component

は、ES6 のキーワードを使おうとしていた ( extends を使用して定義されていないクラスからサブクラス化することができます。 class . で奇妙な動作に遭遇するのは、おそらくこれが原因です。 super の定義など。

そう、そうなんです。 TL;DR - React v0.13.xにアップデートしてください。

円形依存性

また、循環型のインポート構造をとっている場合にも発生する可能性があります。あるモジュールが別のモジュールをインポートしていたり、その逆もあります。この場合、これを避けるためにコードをリファクタリングする必要があります。 詳細情報