截止目前,以前都是在使用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
里面有很多细节是在本博客没有的 ,可以自己看下,不懂的可以加群交流。
领取专属 10元无门槛券
私享最新 技术干货