安装react 步骤
//cnpm i react react-dom -S 安装react
//导入
//1.这两个导入的时候，接收的成员名称，必须这么写
import Reaact from 'react' //创建组件、虚拟 DOM 元素，生命周期
import ReactDOM from 'react-dom' //把创建好的组件和虚拟 DOM 放到页面上展示的
//2.创建虚拟 DOM 元素
//参数1：创建的元素的类型、字符串、表示元素的名称
//参数2：是一个对象或 null ，表示 当前这个 DOM 元素的属性
//参数3：子节点（包括 其他 虚拟 DOM 获取文本子节点）
//参数n:其他子节点
// <h1 id="myh1" title="this is a h1">这是一个大大的h1</h1>
// const myh1 =React.createElement('h1','null','这是一个大大上午h1')
const myh1=React.createElement('h1',{id:'myh1',title:'this is a h1'},'这是一个大大的h1')
const mydiv=React.createElement('div',null,'这是一个div元素',myh1)
//渲染 页面上的DOM 结构，最好的方式，就是写 HTML 代码
//const mytest=<div>aaaaa</div>
//3.使用 ReactDOM 把虚拟 DOM 渲染到页面上
// 参数1：要渲染的那个虚拟 DOM 元素
// 参数2：指定页面上的 DOM 元素，当作容器
ReactDOM.render(mytest,document.getElementById('app'))
==============================================================================================
基本使用配置
//1.安装babel插件
// cnpm i babel-core babel-loader babel-plugin-transform-runtime -D
// cnpm i babel-prest-env babel-preset-stage-0 babel-preset-react -D
//2.配置webpack.json的
// module: { // 所有第三方 模块的配置规则
// rules: [ // 第三方匹配规则
// { test: /.js|jsx$/, use: 'babel-loader', exclude: /node_modules/ }, // 千万别忘记添加 exclude 排除项
// ]
// }
//3.配置 .babelrc
// {
// "presets": ["env", "stage-0", "react"],
// "plugins": ["transform-runtime"]
// }
// HTML 是最优秀的标记语言；
// 注意： 在 JS 文件中，默认不能写 这种 类似于 HTML 的标记；否则 打包会失败；
// 可以使用 babel 来转换 这些 JS 中的标签；
// 大家注意：这种 在 JS 中，混合写入类似于 HTML 的语法，叫做 JSX 语法； 符合 XML 规范的 JS ；
// 注意： JSX 语法的本质，还是 在运行的时候，被转换成了 React.createElement 形式来执行的；
//4，
const mydiv = <div id="mydiv" title="div aaa">
这是一个div元素
<h1>这是一个大大的H1</h1>
</div>