移动端WEB网页开发之开发资源准备（一）

移动端WEB网页开发之开发资源准备

1.开发工具
   微信开发者工具 vsCode ，vscode强大编辑能力和windows无缝贴合，可以定制自己的主题，快捷键等等，微信开发工具能够很好的模拟页面展示预览效果，而且可以调节屏幕尺寸，方便浏览在不同分辨率下的显示。

2.调试工具
   抓包工具：Fiddler charles[二选一]
   抓包插件：vConsole eruda[二选一]

如果只是抓包建议charles，它可以监控本机与internet交换的所有数据信息，并且把相关资源请求都会合并成树形结构方便查询。抓包插件主要是集成到代码中，模拟生成一个类似浏览调试工具一样的工具栏，展示相关的调试信息，这在封装的webview界面很是强大，更易于调试其内部的html页面。

3.热部署
   browser-sync[可选]，热部署的方式有很多，有脚手架自动配置的，也有利用相关的node包来发布资源的容器实现，主要目的是‘所见即所得’，无需重启服务容器就可实时预览修改后的效果~~~~

                                                                                                                                                                                                      ------------------------------------------------------分割线-------------------------------------------------------------------------

开发资源使用方式：

1.正对普通的传统代码组织方式，以上很好配合使用，利用vscode编辑代码，集成抓包插件后再利用node模块browser-sync将源码资源目录发布出来，再使用微信开发工具的网页调试模式来预览，或者在微信中打开项目链接，当然也可以在浏览器的调试模式下打开。加入有更好的调试条件，建议使用uc开发者调试工具。

2.针对非传统，组件化的开发方式来讲，由于各种webpack脚手架已经集成了相应的热部署插件，所以可以充分使用相关npm插件包来实现，由于在移动端无法启动类似浏览器般的调试工具，因此集成抓包插件是很有必要的，再者项目在相应端口发布后还是要预览，那么浏览器设备调试模式或者微信开发工具以及uc开发者调试工具是不错的选择。