Подтвердить что ты не робот

Uncaught ReferenceError: React не определен

Привет, я знаю, что этот вопрос задавался довольно много раз, но я не мог получить ответ.

Я пытаюсь написать пример React hello world. У меня есть только два файла: один app.jsx и еще одна homepage.jsx. Я использую 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 ('response') в app.jsx, он отлично работает.

Я не понимаю этого. Я включил реакцию на homepage.jsx, где я его использую. В app.jsx мне требуется только реагировать, потому что я не использую React. Тогда почему он дает ошибку в app.jsx.

Помощь Pls!

4b9b3361

Ответ 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(), поэтому в сфере действия требуется React. Итак, вы используете React в app.js. Используется для импорта, когда вы используете JSX или прямые вызовы React.*.