未知のReferenceError：反応が定義されていません

Question

こんにちは私はこのタイプの質問がかなり数回頼まれていることを知っていますが、私は答えを得ることができませんでした。

私はReact hello worldの例を書こうとしています。 app.jsxとhomepage.jsxの2つのファイルしかありません。私はwebpackを使用してファイルをバンドルしています。

しかし、私は、私はUncaught ReferenceError: React is not defined

マイhomepage.jsxこの

"use strict"; 

var React = require('react'); 

var Home = React.createClass({ 
    render : function() { 
     return (
      <div className="jumbotron">     
       <h1> Hello World</h1> 
      </div> 
     ); 
    } 
}); 

module.exports = Home; 

マイapp.jsは、ブラウザでこの

var ReactDOM = require('react-dom'); 

var Home = require('./components/homePage'); 

ReactDOM.render(
    <Home/>, 
    document.getElementById('app') 
); 

のように見えるように、それはUncaught ReferenceError: React is not definedをスローに見える取得コードを実行します7行目、すなわちホームページが必要な場所

しかし、私はvar React = require（ 'react'）をapp.jsxに追加するとうまく動作します。

私はこれを理解していません。私はhomepage.jsxに反応を含めて、どこでそれを利用しています。私はReactを使用しないため、app.jsxではリアドームしか必要ありません。なぜapp.jsxにエラーが出るのですか？

Pls help !!

Answer 1

変更あなたのapp.jsこの

var React = require('react'); 
var ReactDOM = require('react-dom'); 

var Home = require('./components/homePage'); 

ReactDOM.render(
    <Home/>, 
    document.getElementById('app') 
); 

にJSXは、このように範囲で必要とされて反応し、React.createElement()の呼び出しに変換されます。そう、はい、あなたはをapp.jsに使っています。 JSXを使用するか、直接React.*コールを使用するたびに、それをインポートするのに慣れてください。

Answer 2

あなたのコードでそれを必要とせずに持つことができます。

webpack.config.jsに入れる：

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

私はこのようなものに少し新しいですが、あなたは、なぜ `必要（ '反応-DOMを説明することができ、万が一http://webpack.github.io/docs/shimming-modules.html#plugin-provideplugin