Uncaught ReferenceError：Reactが定義されていません

このチュートリアルを使用して、ReactJSをレールで動作させようとしています。このエラーが発生します：

Uncaught ReferenceError: React is not defined

しかし、私は、ブラウザのコンソールでオブジェクトを反応させるのにアクセスすることができ 、私も追加公開/ DIST /ターボreact.min.js説明したように、ここも追加説明するようにapplication.js内の行を、この答えに運に。さらに、エラーが発生します。
//= require components
var React = require('react')
Uncaught ReferenceError: require is not defined

誰かがこれを解決する方法について私に提案できますか？

[編集1]
参照用のソースコード：
これは私のcomments.js.jsxファイルです：

var Comment = React.createClass({
  render: function () {
    return (
      <div className="comment">
        <h2 className="commentAuthor">
          {this.props.author}
        </h2>
          {this.props.comment}
      </div>
      );
  }
});

var ready = function () {
  React.renderComponent(
    <Comment author="Richard" comment="This is a comment "/>,
    document.getElementById('comments')
  );
};

$(document).ready(ready);

そしてこれは私のindex.html.erbです：

<div id="comments"></div>

webpackを使用して、次のチャンクを含むjavascriptをビルドしているときに、このエラーを再現できましたwebpack.config.json。

externals: {
    'react': 'React'
},

この上記の構成はrequire('react')、npmモジュールをロードすることによって解決するのではなく、代わりにwindowと呼ばれるグローバル変数（つまりオブジェクト上）を期待するようにwebpackに指示しますReact。解決策は、この構成の一部を削除するか（Reactがjavascriptにバンドルされるようにする）、またはこのファイルが実行される前に（window.React存在するように）Reactフレームワークを外部にロードすることです。

使用していたため、このエラーが発生しました

import ReactDOM from 'react-dom'

reactをインポートせずに、以下に変更すると：

import React from 'react';
import ReactDOM from 'react-dom';

エラーは解決されました:)

Webpackを使用している場合requireは、コードで明示的に指定しなくても、必要に応じてReactをロードできます。

webpack.config.jsに追加します：

plugins: [
   new webpack.ProvidePlugin({
      "React": "react",
   }),
],

http://webpack.github.io/docs/shimming-modules.html#plugin-providepluginを参照してください

考えられる理由は、1。React.JSをページにロードしなかった、2。上記のスクリプトの後にページにロードした。解決策は、上記のスクリプトの前にJSファイルをロードすることです。

PS

可能な解決策。

1. reactwebpack構成内のexternalsセクションで言及する場合は、前に、reactjsファイルをhtmlに直接ロードする必要があります。bundle.js
2. あなたがラインを持っていることを確認してください import React from 'react';

追加してみてください：

import React from 'react'
import { render } from 'react-dom'
window.React = React

render()関数の前。

これにより、ポップアップエラーが返されるのを防ぐことがあります。

Reactが定義されていません

Reactウィンドウに追加すると、これらの問題が解決されます。

Santoshへの追加：

Reactをロードすることができます

import React from 'react'

import React, { Component, PropTypes } from 'react';

これもうまくいくかもしれません！

コードreact.createClassで大文字ではなく小文字でコンポーネント定義のスペルを間違えたため、このエラーが発生しましたReact.createClass。

私は同じ問題に直面していました。私はインポートして、それを解決Reactし、ReactDOM以下のようにのように：

import React from 'react';
import ReactDOM from 'react-dom';

BabelとReact17を使用している場合は、configに「runtime2： "automatic」を追加する必要があるかもしれません。

 {
     "presets": ["@babel/preset-env", ["@babel/preset-react", {
        "runtime": "automatic"
     }]]
 }

表示されたエラー

その後、インポートが反応します

最後にreact-domをインポートします

エラーが反応する場合は定義されていません、追加してください==>import React from 'react';

エラーがreactDOMが定義されていない場合は、追加してください==>import ReactDOM from 'react-dom';

TypeScriptを使用している場合tsconfig.jsonは、"jsx": "react"内にあることを確認してください"compilerOptions"。