运行 React js 示例 Web 应用程序时出现控制台错误答案

【问题标题】：Console error while running react js sample web app运行 React js 示例 Web 应用程序时出现控制台错误
【发布时间】：2016-12-28 00:32:47
【问题描述】：

我是 React js 的新手，正在尝试开发一个非常简单的 hello react kinda 网络应用程序。但是在运行时，在控制台中出现以下错误。

不推荐为已经拥有影子根的元素调用 Element.createShadowRoot()。有关详细信息，请参阅https://www.chromestatus.com/features/4668884095336448。

浏览器：Chrome 版本 46.0.24

html代码：

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8"/>
        <script src="https://cdnjs.cloudfare.com/ajax/libs/babel-core/5.8.23/browser.min.js"></script>
        <script src="https://cdnjs.cloudfare.com/ajax/libs/react/0.14.7/react.js"></script>
        <script src="https://cdnjs.cloudfare.com/ajax/libs/react/0.14.7/react-dom.js"></script>
    </head>
    <body>
        <div id="app"></div>
        <script type="text/babel">
            ReactDOM.render(
                <h1>Hello React!</h1>
                document.getElementById('app')
            );
        </script>
    </body>
</html>

谁能指出可能出了什么问题。

提前致谢。

【问题讨论】：

没有代码我们帮不了你:)
@martriay 用代码查看更新后的问题。谢谢

标签： javascript google-chrome reactjs jsx

【解决方案1】：

首先，您用于库文件的cdns 无法访问。

在 React Docs 页面中，这些是 cdn 的工作链接：

https://npmcdn.com/react@15.3.1/dist/react.min.js

https://npmcdn.com/react-dom@15.3.1/dist/react-dom.min.js

https://npmcdn.com/babel-core@5.8.38/browser.min.js

其次，<h1>Hello React!</h1> 之后应该有逗号分隔 应该呈现的内容 和 where 。

所以你的代码应该是这样的：

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8"/>
        <script src="https://npmcdn.com/babel-core@5.8.38/browser.min.js"></script>
        <script src="https://npmcdn.com/react@15.3.1/dist/react.min.js"></script>
        <script src="https://npmcdn.com/react-dom@15.3.1/dist/react-dom.min.js"></script>
    </head>
    <body>
        <div id="app"></div>
        <script type="text/babel">
            ReactDOM.render(
                <h1>Hello React!</h1>,
                document.getElementById('app')
            );
        </script>
    </body>
</html>

【讨论】：

是的。后来才意识到。使用正确的 CDN 解决了问题。谢谢
@user3400887 如果解决方案有效，请将答案标记为正确。

【解决方案2】：

您的链接已损坏。使用这些更新的链接

使用域cdnjs.cloudflare.com 而不是cdnjs.cloudfare.com

https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.23/browser.js
https://cdnjs.cloudflare.com/ajax/libs/react/0.14.7/react.js
https://cdnjs.cloudflare.com/ajax/libs/react/0.14.7/react-dom.js

【讨论】：