Question

＆＃13;

var Button = React.createClass({
render: function  () {
	return:(
              <button>Go</button>
		)
}

});
React.render(<Button />, document.getElementById("root"));

＆＃13;

<!DOCTYPE html>
<html>
<head>
<title>My React Page</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.13.3/react.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.13.3/JSXTransformer.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    

</head>

<body>

<div id="root"></div>

<script type="text/jsx" src="../1.js"></script>
</body>
</html>

＆＃13;

我在Chrome控制台中遇到以下错误。

无法加载资源：net :: ERR_FILE_NOT_FOUND react.js：113下载   React DevTools提供更好的开发体验：   https://fb.me/react-devtools

JSXTransformer.js：314您正在使用浏览器内的JSX转换器。是   一定要预编译你的JSX用于生产 -   http://facebook.github.io/react/docs/tooling-integration.html#jsx

JSXTransformer.js：215 XMLHttpRequest无法加载   文件：/// d：/React.js/react-0.13.3/examples/MyApplication/1.js。交叉   原始请求仅支持协议方案：http，数据，   chrome，chrome-extension，https，chrome-extension-resource.load @   JSXTransformer.js：215

JSXTransformer.js：215 Uncaught NetworkError：无法执行＆＃39;发送＆＃39;   on＆＃39; XMLHttpRequest＆＃39;：无法加载   ＆＃39;文件：/// d：/React.js/react-0.13.3/examples/MyApplication/1.js' ;.

Answer 1

这不是React / JSX问题。直接从文件系统加载内容时，您会遇到Chrome网络浏览器的CORS限制。

你可以采取两种方式：

使用extensions禁用Chrome CORS行为，或者使用--disable-web-security CLI标记和诸如此类的设置。
使用node.js http-server，python SimpleHTTPServer等开发网络服务器。

IMO开发网络服务器选项比黑客攻击特定的网络浏览器更加标准，便携，透明。

然后您还有未捕获错误：解析错误：第3行：意外令牌：，因此请移除: Button.render中的错误return。

我在运行以下简单的react.js应用程序时遇到的错误很少...任何想法？

1 个答案: