不使用热部署
根据第二篇文章,我们现在已经搭建好了环境,并且也写了一个React入门demo,但是存在一个修改时的问题:我们每次开发完成之后都需要在命令行输入webpack打包生成bundle.js后才能运行查看结果:
1.修改内容
图片.png
2.进入目录打包
shizhengyangdeMacBook-Pro:0504 panyuanyuan$ pwd
/Users/panyuanyuan/java/react-native/react_more/0504
shizhengyangdeMacBook-Pro:0504 panyuanyuan$ webpack
3.观察运行
图片.png
热部署情况下
上面的模式开发的时候会影响效率,这时候我们可以使用热部署
1.热部署命令
这次我们观察运行结果的时候不适用webpack,而使用webpack --watch.这样就实现了热部署
webpack --watch
2.观察结果
图片.png
修改js文件,刷新文件
图片.png
3.服务热加载
我们还可以以服务的方式进行热加载:保持上面的窗口不懂,打开新的终端输入:
webpack-dev-server --inline --hot
这时候我们就可以以服务的方式启动访问,并且也是热部署:
图片.png
修改js文件后刷新页面:
图片.png
