React Uncaught Reference Error - Objekt/Klasse nicht definiert

Ich bin noch völlig neu zu reagieren. Ich habe versucht, mit den folgenden Inhalten in index.html-Datei erstellen:React Uncaught Reference Error - Objekt/Klasse nicht definiert

<!DOCTYPE html> 
<html> 
    <head> 
    <meta charset="utf-8"> 
    <title>React Tutorial</title> 
    <!-- Not present in the tutorial. Just for basic styling. --> 
    <link rel="stylesheet" href="css/base.css" /> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.7/react.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.7/react-dom.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.6.15/browser.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/marked/0.3.5/marked.min.js"></script> 
    </head> 
    <body id="html-body"> 
    <div id="content"></div> 
    <script type="text/babel" src="scripts/box.js"></script> 
    <script type="text/babel"> 
    ReactDOM.render(
     <Box />, 
     document.getElementById('content') 
    ); 
    </script> 
    </body> 
</html>

Und in scripts/box.js Ich habe den folgenden Code:

var Box = React.createClass({ 
    render: function() { 
    return (
     <h2>Purple Monkey</h2> 
    ); 
    } 
});

Als ich index.html in meinem Browser zu sehen, erhalte ich die Fehler Uncaught ReferenceError: Box is not defined. Aber wenn ich die Zeile ReactDOM.render in index.html in die scripts/box.js direkt nach der Definition der Box-Klasse verschiebe, funktioniert alles.

Warum kann ich nicht die ReactDOM.render außerhalb von scripts/box.js ausführen? Wie kann ich eine reaktive Komponente richtig einbeziehen/benötigen, damit sie von anderen Javascript-Dateien verwendet werden kann?

Quelle

2016-03-22 John

@John Ich habe keine Ahnung, wie '

Verwandte Themen