webpack项目中react的基本使用

1.安装react react-dom

cnpm i react react-dom -S

在 8.X版本的babel中
需要安装@babel/preset-react（额外的）
react 专门用来创建组件和虚拟DOM的，提供了组件的生命周期 react-dom
专门进行对DOM的操作，将组件和虚拟DOM渲染到浏览器中

2.在.js文件中导入

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

这里的接收名称一定要这么写

3.创建虚拟DOM元素

const 虚拟DOM元素= React.createElement()

参数1：创建元素的类型，字符串，写元素标签的名称
参数2：是一个对象或null，表示当前这个DOM元素的属性,用{}将属性包裹起来
参数3：子节点（包括其他虚拟DOM或文本子节点）
参数n：其他子节点
在配置babel后，就可以使用jsx语法来定义虚拟DOM元素了

4.将虚拟DOM渲染到页面上

ReactDOM.render(虚拟DOM元素，document.getElementById('app'))

参数1：要渲染的虚拟DOM元素
参数2：指定页面上的DOM对象，当作容器