JSX 是JavaScript的擴充套件語法，具備了JavaScript的全部能力，在react中推薦使用JSX 來作為渲染元件的元素。下面一起來看一下他的語法規則。

import React from 'react';
import ReactDOM from 'react-dom';
// import Hello  from '@/component/print.js/Hello';


const user = {
  firstName: 'Harper',
  lastName: 'Perez'
};

const element = (
  <h1>
    Hello,{formatName(user)}!
  </h1>
);

ReactDOM.render(
  element,
  document
 
.getElementById('root')
);

function formatName(user) {
  return user.firstName + ' ' + user.lastName;
}

if(module.hot){
    module.hot.accept()
}

注：這裡只做了程式碼的分享，react的環境搭建就不在這裡介紹了，網上有很多資料，如果嫌麻煩的話，可以使用react 官方推薦的 “ create-react-app” 腳手架快速構建環境。還需注意的一點是，JSX的渲染是從上到下的，ReactDOM.render(
element,
document.getElementById('root')
);