Reactjs: Avviso: React.createElement: tipo non dovrebbe essere nulla o non definito

Question

questo l'errore completo

Attenzione: React.createElement: tipo non dovrebbe essere nulla o non definito. Dovrebbe essere una stringa (per elementi DOM) o una ReactClass (per componenti compositi).

e questo è tutto quello che ho in questa vista

import React, { Component } from 'react'; 
import Router, {Link, RouteHandler} from 'react-router'; 
import { Grid, Row, Column, List, ListItem } from '../../components/Layout'; 
import { RaisedButton, Paper } from 'material-ui'; 

const videosInformation = { 
    time  : 25, 
    gameId : 15665, 
    date  : '12 10 2015', 
    gameName : "Black Jack" 
}; 

export default class Home extends Component { 

    static contextTypes = { 
    router : React.PropTypes.func 
    } 

    render() { 
    return <Grid>     
     <Row> 
     <Column> 
      <Paper> 
      <List subheader="Player Info"> 
       <ListItem primaryText={`Name: ${videosInformation.time}`} /> 
       <ListItem primaryText={`Nickname: ${videosInformation.date}`} /> 
       <ListItem primaryText={`Age: ${videosInformation.gameId}`} /> 
       <ListItem primaryText={`Language: ${videosInformation.gameName}`} /> 
      </List> 
      </Paper> 
     </Column> 
     <Column> 
      <iframe width="560" height="315" src="https://www.youtube.com/embed/Ta4xuThmAsQ" frameBorder="0" allowFullScreen></iframe> 
     </Column> 
     </Row> 
    </Grid>; 
    }; 

} 

Sto usando Material-UI

Answer 1

E 'probabile che il file Layout non sta esportando una delle variabili da questa linea

import { Grid, Row, Column, List, ListItem } from '../../components/Layout'; 

L'avviso si verifica se uno di quelli non è definito.

Answer 2

So che la soluzione giusta è stata trovata qui ma volevo solo condividere un altro possibile motivo per l'avviso ReactJS React.createElement: type should not be null or undefined da attivare.

Può succedere anche quando si ha una dipendenza circolare nei moduli. Quindi, facendo un console.log() del modulo importato si restituirebbe un oggetto vuoto.

Per ulteriori dettagli, date un'occhiata a questo altro thread StackOverflow: Require returns an empty object

Answer 3

Solo nel caso in cui qualcuno ha incontrato questo problema e le soluzioni di cui sopra non stanno aiutando, tutto quello che dovevo fare era spostare la mia top-level Funzione ReactDOM.render() sotto il resto del codice JavaScript per garantire che tutte le variabili siano state inizializzate prima di essere richiamate. Stavo seguendo il tutorial su https://reactjs.net/getting-started/tutorial_aspnet4.html