webpack4手动配置安装react开发

截止目前，以前都是在使用webpack打包react来进行开发，为了跟随技术的步伐，今天来折腾下新版本的新用法

实践环境

1、创建项目并安装

react开发需要用到的

babel相关的是用来做es5/es6语法解析的

eslint相关的是用来做语言检查的

2、eslint、babel和webpack相关配置

.eslintrc

.babelrc // 这个文件可以不用加 暂时不起作用

下面来修改index.js，修改index.js为index.jsx

src/index.jsx

添加src/components/AppComponent.jsx

修改index.html，这个只是作为一个模板来使用，具体的后期复杂逻辑，以后的文章分享

项目目录最终的结构

运行开发环境的命令

执行后，会看到页面展示React Demo，代表我们的程序加好了，之后可以直接进行相关的开发

上面两个都会直接生成dist文件夹，然后里面会生成需要部署的所有文件

项目地址

https://github.com/durban89/webpack4-react16-demo.git

里面有很多细节是在本博客没有的 ，可以自己看下，不懂的可以加群交流。