ReactJS: "Uncaught SyntaxError: Unerwartetes Token & lt;"
Ich versuche den Einstieg in die Erstellung einer Website in ReactJS. Allerdings, wenn ich versuchte, meinen JS in eine eigene Datei, ich habe immer diesen Fehler: "Uncaught SyntaxError: Unexpected token <".
Habe ich versucht, indem /** @jsx React.DOM */
an die Spitze der JS-Datei, aber es hat nicht alles reparieren. Nachfolgend werden die HTML-und JS-Dateien. Alle Ideen, was falsch läuft?
HTML
<html>
<head>
<title>Page</title>
<script src="http://fb.me/react-0.12.2.js"></script>
<script src="http://fb.me/JSXTransformer-0.12.2.js"></script>
<script src="http://code.jquery.com/jquery-1.10.0.min.js"> </script>
<script src="./lander.js"> </script>
</head>
<body>
<div id="content"></div>
<script type="text/jsx">
React.render(
<Lander />,
document.getElementById('content')
);
</script>
</body>
</html>
JS
/**
* @jsx React.DOM
*/
var Lander = React.createClass({
render: function () {
var info = "Lorem ipsum dolor sit amet... ";
return(
<div>
<div className="info">{info}</div>
</div>
);
}
});
EDIT: ich erkannte, dass ich brauche, um hinzuzufügen type="text/jsx"
auf das script-tag, das beinhaltet mein lander code. Jedoch, nachdem Sie diese und laden bekomme ich diese Warnung
"Sie sind mit der in-browser-JSX-Transformator. Werden Sie sicher, dass vorkompilieren JSX für die Produktion - http://facebook.github.io/react/docs/tooling-integration.html#jsx"
gefolgt von dieser Fehlermeldung:
"XMLHttpRequest-Objekt kann nicht geladen werden file:///Users/.../lander.js. Cross-origin-requests werden nur für die unterstützten Protokoll-Schemata: http, Daten -, chrome-Erweiterung, https -, chrome-Erweiterung-Ressource".
wie es scheint, ist es etwas anderes, dass ich tun muss, um im browser jsx-Transformation zu arbeiten, aber ich bin mir nicht sicher, was es ist.
EDIT: OOOOH muss ich Gastgeber es mit MAMP oder so?
InformationsquelleAutor der Frage kat | 2015-01-22
Du musst angemeldet sein, um einen Kommentar abzugeben.
Hinzufügen
type="text/jsx"
zu densrc
attribue vonscript
- tag verwendet, um JavaScript-Datei muss umgewandelt werden von JSX Transformator, so:Dann können Sie MAMP oder einen anderen service für das hosten der Seite auf localhost, so dass alle Einschlüsse Arbeit, wie besprochen hier.
Dank für all die Hilfe, jeder!
InformationsquelleAutor der Antwort kat
JSTransform ist veraltet , nutzen Sie bitte babel statt.
InformationsquelleAutor der Antwort Pumych
Hinzufügen
type="text/babel"
als ein Attribut des script-tag, wie diesem:InformationsquelleAutor der Antwort NAVIN SINGH BISHT
Hinzufügen
type="text/babel"
um das Skript umfasst .jsx-Datei und fügen Sie diese:<script src="https://npmcdn.com/[email protected]/browser.min.js"></script>
InformationsquelleAutor der Antwort AlexGH
Wenn Sie so etwas wie
Du wahrscheinlich verpasst, ein Komma in einem Ort wie diesem:
InformationsquelleAutor der Antwort emisilva
Den code, den Sie haben, der richtige ist. JSX-code kompiliert werden muss, um JS:
http://facebook.github.io/react/jsx-compiler.html
InformationsquelleAutor der Antwort stewart715
Wenn Sie bekommen eine Fehlermeldung wie diese :
Könnte es sein, die Ihnen fehlt eine geschweifte Klammer
InformationsquelleAutor der Antwort R2D2
Versuchen Sie, im webpack, es löste das ähnliche Problem in meinem Projekt. Speziell der "presets" - Teil.
InformationsquelleAutor der Antwort Deshak9