webpack系列(四):搭建Vue和React

前文：

​ 我在使用webpack的过程中，遇到一个坑，这个坑跟cnpm和npm 有关系，所以当去下载依赖的时候，记得如果用cnpm下载的话，都用cnpm下载就可以，要不然打包和运行的时候很容易会出现bug，当然也可以给node_modules文件夹删掉，重新cnpm i 或 npm i 进行全部下载 都是可以的

一、先简单说下搭建React环境

1. 下载依赖

npm install --save-dev @babel/preset-react
npm insstall react react-dom --save

2.在项目根目录下创建 .babelrc 文件 ，进行配置

{
   
  "presets": [
    ["@babel/preset-react"]
  ]
}

3. 在webpack.config.js 文件中 配置

注意：如果没有下载babel-loader的话，通过以下命令进行下载

npm install babel-loader --save-dev

module:{
   
	rules:[
		{
   
            {
   
                test: /\.js$/,
                exclude: /node_modules/,
                loader: 'babel-loader',
            },
		}
	]
}

4. 在js文件中去简单使用React

import React,{
   Component} from 'react'
import ReactDom from 'react-dom'
class App extends