在定義React組件或者書寫React相關代碼，不管代碼中有沒有用到React這個對象，我們都必須將其import進來

import React from 'react';    // 下面的代碼沒有用到React對象，為什么也要將其import進來
import ReactDOM from 'react-dom';

ReactDOM.render( <App />, document.getElementById( 'editor' ) );

關于這個問題，我們看一下打包工具的.babelrc文件就全明白了

{
    "presets": ["env"],
    "plugins": [
        ["transform-react-jsx", {
            "pragma": "React.createElement"
        }]
    ]
}

因為打包工具是需要React.createElement這個方法把你寫的jsx轉(zhuǎn)化為虛擬DOM的，就像這樣

import React from './react'
import ReactDOM from './react-dom'

class App extends React.Component {
    render() {
        return <h1>Hello,World!</h1>
    }
}

const element = ( <div className="123">
    <span>hello</span>
    <div>world</div>
</div>
)
console.log('element', element)


ReactDOM.render(
    <App />,
    document.getElementById( 'root' )
);