React.js基本設置

-1

請幫忙。我是全新的，所以我知道這是非常基本的，但我無法弄清楚我的設置有什麼問題。無論我做什麼，我都會收到語法錯誤。我把代碼放在codepen中，它工作。我需要讓我的本地工作。React.js基本設置

我有一個DIST文件夾用的index.html和index.js

的index.html

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <title>React</title> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.3.1/react.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.3.1/react-dom.js"></script> 
</head> 
<body> 
    <div id="root"> 
    <!-- This div's content will be managed by React. --> 
</div> 
    <script src="index.js"></script> 
</body> 
</html>

index.js

ReactDOM.render(
    <h1>Hello, world!</h1>, 
    document.getElementById('root') 
);

錯誤

意外的標記<

我也嘗試這個代碼

的index.html

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <title>React</title> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.4.2/react.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.4.2/react-dom.js"></script> 
</head> 
<body> 
    <div id="react-container"></div> 
    <script src="index.js"></script> 
</body> 
</html>

index.js

const { createElement } = React 
const{ render } = ReactDom 

const title = createElement(
'h1', 
{id: 'title', className: 'header'}, 
'Hello World' 
) 

render(
title, 
document.getElementById('react-container') 
)

誤差ReactDom沒有定義

或

const title = React.createElement(
    'h1', 
    {id: 'title', className: 'header'}, 
    'Hello World' 
) 

ReactDOM.render(
    tile, 
    document.getElementById('react-container') 
)

錯誤標題未定義

來源

2017-03-17 Tayler Ramsay

好吧，在你最後的例子中，至少你有'ReactDOM.render（tile ...）' - 注意'tile'而不是'title'。對於「ReactDom」未定義，它可能是'ReactDOM' - 請注意大寫的'DOM' –

您是否考慮過使用Create React App？這是一個非常好的方式，可以輕鬆入門：https：//github.com/facebookincubator/create-react-app – dbburgess