在浏览器中 Chrome 中的 JSX 转换

我试图遵循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>

然而，上述方法似乎不起作用。我的文档正文中没有收到 HelloReact。

我对 React （以及 JSX Transformation 等）完全陌生。任何帮助将不胜感激。

我在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.

注意：fb shortened url fb.me，Stackoverflow抱怨使用缩短器，

正如许多人已经注意到的那样，React 和 React Native 都有切换了各自的构建系统以使用 Babel。这取代了JSTransform，我们编写的源代码转换工具脸书。

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

使用

babel 将 JSX 语法转换为 JS，并在文件中使用 JS

相关内容

最新更新

热门标签：