安装:
mkdir react-demo1
cd react-demo1
npm init --yes
安装3个内容:
cnpm i --save react react-dom @babel/standalone
安装成功后,结构:
**********************************************************
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>demo</title>
</head>
<body>
<div id="app"></div>
<script src="node_modules/@babel/standalone/babel.js"></script>
<script src="node_modules/react/umd/react.development.js"></script>
<script src="node_modules/react-dom/umd/react-dom.development.js"></script>
<script type="text/babel">
// const element = <h1>Hello, react!</h1>
// 换行或者多标签,推荐加 ()
// const element = (
// <div>
// <h1>hello react</h1>
// <p>aaa</p>
// </div>
// )
//
function getTitle() {
// JavaScript 语法,return 就不往后执行了
return (
<div>
<h1>hello</h1>
<p>haha</p>
</div>
)
}
const element = getTitle()
ReactDOM.render(
element,
document.getElementById('app')
)
</script>
</body>
</html>
效果:
*****************