Error de referencia no detectado: React no está definido

Estoy tratando de hacer que ReactJS funcione con rieles usando este tutorial. Recibo este error:

Uncaught ReferenceError: React is not defined

Pero puedo acceder al objeto React en la consola del navegador . También agregué public / dist / turbo-react.min.js como se describe aquí y también agregué una línea en application.js como se describe en esta respuesta a no tener suerte. Además, da el error:
//= require components
var React = require('react')
Uncaught ReferenceError: require is not defined

¿Alguien puede sugerirme cómo resolver esto?

[EDITAR 1]
Código fuente para referencia:
Este es mi comments.js.jsxarchivo:

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);

Y este es mi index.html.erb:

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

Pude reproducir este error cuando estaba usando webpack para construir mi javascript con el siguiente fragmento en mi webpack.config.json:

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

Esta configuración anterior le dice al paquete web que no se resuelva require('react')cargando un módulo npm, sino que espere una variable global (es decir, en el windowobjeto) llamada React. La solución es eliminar esta parte de la configuración (por lo que React se incluirá con su javascript) o cargar el marco de React externamente antes de que se ejecute este archivo (para que window.Reactexista).

Recibí este error porque estaba usando

import ReactDOM from 'react-dom'

sin importar reaccionar, una vez que lo cambié a continuación:

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

Se solucionó el error :)

Las posibles razones son: 1. no cargó React.JS en su página, 2. lo cargó después del script anterior en su página. La solución es cargar el archivo JS antes del script que se muestra arriba.

PD

Soluciones posibles.

1. Si menciona reacten la sección de externos dentro de la configuración del paquete web, entonces debe cargar los archivos de reacción js directamente en su html antesbundle.js
2. Asegúrate de tener la línea import React from 'react';

Si está utilizando Webpack, puede hacer que cargue React cuando sea necesario sin tener que hacerlo explícitamente requireen su código.

Agregar a webpack.config.js :

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

Ver http://webpack.github.io/docs/shimming-modules.html#plugin-provideplugin

Intenta agregar:

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

antes de la render()función.

Esto a veces evita que el error aparezca en la ventana emergente:

Reaccionar no está definido

Agregar Reacta la ventana resolverá estos problemas.

Añadiendo a Santosh:

Puedes cargar React por

import React from 'react'

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

¡Esto también puede funcionar!

Recibí este error porque en mi código escribí mal la definición de un componente con minúsculas en react.createClasslugar de mayúsculas React.createClass.

Estaba enfrentando el mismo problema. Lo resolví importando Reacty me ReactDOMgusta de la siguiente manera:

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

El error mostrado

después de esa importación reaccionar

Finalmente importar react-dom

si el error es reaccionar no está definido, agregue ==>import React from 'react';

si el error es reactDOM no está definido, agregue ==>import ReactDOM from 'react-dom';

Si está utilizando TypeScript, asegúrese de que tsconfig.jsontiene "jsx": "react"dentro "compilerOptions".