React基本配置及简单使用

进入正题

文件目录如下:

注意：在webpack 4.x 中，有一个很大的特性，就是 约定大于配置，默认的打包入口路径就是 src -> index.js
需要配置的文件: webpack.config.js

index.html

index.js

初始化 npm init -y

安装webpack npm i webpack -D 和 cnpm i webpack-cli -D

安装 cnpm i webpack-dev-server -D

`

安装插件: cnpm i html-webpack-plugin -D

调试：npm run dev

安装插件:cnpm i babel-core babel-loader babel-plugin-transform-runtime -D
安装插件:cnpm i babel-preset-env babel-preset-stage-0 babel-preset-react -D
配置 .babelrc 文件

注意此时运行有问题，因为 babel-loader 最新版的问题，我们可以在此修改版本为:`7.1.2`版本，删除 node_modules 然后 cnpm i

最终结果部分展示：