weex native端 js 调试方法

预览文件，写ui的时候我们常常需要能够一边写一边看到ui，以便于调整，weex的toolkit提供了实时预览的功能

$ weex src/foo.vue

该命令下，可以实时的去预览文件，而不需要编译后再去浏览，效率就高了很多，但是目前实时预览只支持web，虽然二维码也是有，但是使用playground扫码后一直显示的是 network err 而且是确保了我的手机在局域网内的，所以暂时不纠结，虽然此时只能网页预览，但是对于开发效率也是有极大提高的，是个好东西

这是一个小插曲，下面就开始说怎么调试一个weex 页面

首先需要手机安装 playground  https://weex.apache.org/cn/playground.html

然后 终端进入到 weex项目文件下 输入

$ weex debug

 等待几秒的时间后，会打开一个网页

打开手机端安装的 playground app，扫描二维码，此时网页上就显示出了我们的设备连接了，如图

然后编译项目，生成对应的js

$weex compile src/foo.vue dist

此时我们可以看到这个页面生成的js

因为weex 暂时还没有直接给这个生成一个二维码的办法，但是根据playground 解析显示的原理，我们知道，weex是通过把pc上的node作为一个server，然后playground 扫描二维码的时候就是上这个server把对应的js 下载下来，那么很简单，我们需要获取到这个js 的html访问路径生成二维码即可

这样就粗糙的制造出来了我们的 生成的js的二维码，然后使用playground 再次扫描这个二维码

此时在playground已然打开这个js，当然我们做这么多并不是为了打开这个js，如果单纯打开js，那很简单，我们此时需要的是调试这个js

weex 的playground 实际的 断点调试等等的问题还很多，按照官方文档的操作会发现，实际上很多东西压根根本没法去调试

然而通过它的 Inspector 却是可以看到很多信息

这些内容都可以看到，而且是手机端解析后的情况，所以还是相当有用的，不管是网络请求，还是日志查看等等的

当然我尝试debug，一直是不停报错

Error:can not find the peer : chrome-inspector[j6g7lz4e4wpwa224fos-0x08]
@(C:\Users\dell\.xtoolkit\node_modules\weex-devtool\lib\components\P2PSession.js:119:24)

所以debug还是会存在不少问题，后面解决后把这块debug的内容补上来