ReactJS：“未捕获的语法错误：意外的记号” [英] ReactJS: "Uncaught SyntaxError: Unexpected token <"
问题描述
我试图在ReactJS中开始构建网站。然而，当我试图把我的JS放在一个单独的文件中时，我开始出现这个错误：Uncaught SyntaxError：Unexpected token<。
c $ c> / ** @jsx React.DOM * / 到JS文件的顶部，但它没有解决任何问题。以下是HTML和JS文件。任何有关错误的想法？
HTML
< HTML>
< head>
< title>页< / 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 src =./ lander.js> < /脚本>
< / head>
< body>
< div id =content>< / div>
< script type =text / jsx>
React.render（
< Lander /> ;,
document.getElementById（'content'）
）;
< / script>
< / body>
< / html>
JS
< pre $ / **
* @jsx React.DOM
* /
var Lander = React.createClass（{
render：function（ ）{
var info =Lorem ipsum dolor sit amet ...;
return（
< div>
< div className =info> {info }< / div>
< / div>
）;
}
}）;
编辑：我意识到我需要添加 type =text / jsx 到包含我的着陆器代码的脚本标记。然而，在添加这个并重新加载后，我得到这个警告
您正在使用浏览器内的JSX转换器，请务必预编译您的JSX以进行生产 - http://facebook.github.io/react/docs/tooling-integration.html#jsx
后面跟着这个错误：
XMLHttpRequest无法加载file：///Users/.../ lander.js。只有协议方案支持交叉源请求：http，data，chrome-extension，https，chrome-extension-resource。
好像有是我需要做的其他事情，以便在浏览器jsx转换工作，但我不知道它是什么。
编辑：OOOOH我需要使用MAMP或东西来托管它？
添加 type =text / jsx添加到 src 脚本标记用于包含必须转换的JavaScript文件通过JSX Transformer，像这样：
$ b
< script type =text / jsxsrc = ./lander.js\"></script>
然后，您可以使用MAMP或其他服务在localhost上托管页面，以便所有包含工作，如讨论这里。 感谢所有帮助大家！ I am trying to get started building a site in ReactJS. However, when I tried to put my JS in a separate file, I started getting this error: "Uncaught SyntaxError: Unexpected token <". I tried adding HTML JS EDIT: I realized that I need to add "You are using the in-browser JSX transformer. Be sure to precompile your JSX for production - http://facebook.github.io/react/docs/tooling-integration.html#jsx" followed by this error: "XMLHttpRequest cannot load file:///Users/.../lander.js. Cross origin requests are only supported for protocol schemes: http, data, chrome-extension, https, chrome-extension-resource." it seems like there is something else that I need to do in order to get in browser jsx transform working, but I'm not sure what it is. EDIT: OOOOH do I need to host it using MAMP or something? Add Then you can use MAMP or some other service to host the page on localhost so that all of the inclusions work, as discussed here. Thanks for all the help everyone! 这篇关于ReactJS：“未捕获的语法错误：意外的记号”的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
/** @jsx React.DOM */ to the top of the JS file, but it didn't fix anything. Below are the HTML and JS files. Any ideas as to what is going wrong?<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>
/**
* @jsx React.DOM
*/
var Lander = React.createClass({
render: function () {
var info = "Lorem ipsum dolor sit amet... ";
return(
<div>
<div className="info">{info}</div>
</div>
);
}
});
type="text/jsx" to the script tag which includes my lander code. However, after adding this and reloading I get this warning type="text/jsx" to the src attribue of script tag used to include JavaScript file that must be transformed by JSX Transformer, like that:<script type="text/jsx" src="./lander.js"></script>
