我的页面无法加载(ReactJS)

时间:2017-03-11 04:26:32

标签: javascript html reactjs

我已通过npm install -g http-server上的Terminal与我的服务器连接,这很正常。我只想查看我的h1标签是否有效,以便我可以继续制作练习网站。我觉得我的mainPage.html可能有点偏离。

这是我的mainPage.html文件:

<!DOCTYPE html>
<html>
<head>
    <title>Testing</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>

</body>

<div id="website"></div>
<script type="text/babel" src="mainPage.js"></script>

</script>
</html>

这是我的mainPage.js文件:

var Website = React.createClass({
  render: function() {
        return(
            <h1>Why won't my h1 tag appear!</h1>
        ); 
    }
});

ReactDOM.render(<Website/>, document.getElementById('website'));

2 个答案:

答案 0 :(得分:0)

您需要导入babel.js,react和reactDOM

<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-standalone/6.23.1/babel.min.js"></script>
<script src="https://unpkg.com/react@15/dist/react.min.js"></script>
<script src="https://unpkg.com/react-dom@15/dist/react-dom.min.js"></script>

答案 1 :(得分:0)

包含location.replace("you home page")的引用,请检查此工作代码:

&#13;
&#13;
react, react-dom and babel
&#13;
&#13;
&#13;