在浏览器中，Chrome中的JSX Transformation

Question

Am trying to follow Mastering React book, There is a sample whose code is below 我试图遵循Mastering React书籍，下面有一个示例代码

<!DOCTYPE html>
<html>

<head lang="en">
    <meta charset="UTF-8">
    <title>Hello React</title>
    <script src="https://<fb shortened url>/react-with-addons-0.14.0.js"></script>
    <script src="https://<fb shortened url>/react-dom-0.14.0.js"></script>
    <script src="http://<fb shortened url>/JSXTransformer-0.13.1.js"></script>
</head>

<body>
    <div id="view" />
    <script>
        var HelloReact = React.createClass({
            render: function () {
                return <h1 > Hello React < /h1>
            }
        });

        ReactDOM.render( < HelloReact / > , document.body);
    </script>
</body>

</html>

The above however does not seem to work. 但是上述似乎不起作用。 I am not getting a HelloReact in my document body. 我在文档正文中没有得到HelloReact。

Am totally new to React (and also JSX Transformation etc.,). 对React（以及JSX Transformation等）来说是全新的。 Any help will be greatly appreciated. 任何帮助将不胜感激。

The error I get in Chrome is 我在Chrome中收到的错误是

Uncaught Error: Invariant Violation: ReactDOM.render(): Invalid component element. Instead of passing an element string, make sure to instantiate it by passing it to React.createElement.

Note : fb shortened url is fb.me , Stackoverflow was complaining about use of shorteners, 注意： fb shortened url是fb.me ，Stackoverflow抱怨使用了缩短剂，

Answer 1

As many people have noticed already, React and React Native have both switched their respective build systems to make use of Babel. 正如许多人已经注意到的那样，React和React Native都已经切换了各自的构建系统以使用Babel。 This replaced JSTransform, the source transformation tool that we wrote at Facebook. 它取代了我们在Facebook上编写的JSTransform（源转换工具）。

https://facebook.github.io/react/blog/2015/06/12/deprecating-jstransform-and-react-tools.html https://facebook.github.io/react/blog/2015/06/12/deprecating-jstransform-and-react-tools.html

Use babel to convert the JSX syntax into JS and use the JS in your file 使用babel将JSX语法转换为JS并在文件中使用JS

在浏览器中，Chrome中的JSX Transformation

问题描述

1 个解决方案

解决方案1
2 2016-04-21 15:54:52

在浏览器中，Chrome中的JSX Transformation

问题描述

1 个解决方案

解决方案1 2 2016-04-21 15:54:52

解决方案1
2 2016-04-21 15:54:52