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

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

  • 发表于:
  • 原文链接https://kuaibao.qq.com/s/20180609G09CU400?refer=cp_1026
  • 腾讯「云+社区」是腾讯内容开放平台帐号(企鹅号)传播渠道之一,根据《腾讯内容开放平台服务协议》转载发布内容。
  • 如有侵权,请联系 yunjia_community@tencent.com 删除。

扫码关注云+社区

领取腾讯云代金券