写在前面：作为前端开发工作者，一款好的调试工具必不可缺。你可能已经习惯了chorme提供的简单好用的网页调试工具，但在weex中，调试是一个巨坑！！
Weex调试踩坑之旅
在weex中，调试是一件非常麻烦但事，好在weex官方文档中提供了一些方案
1. weex-toolkit命令
在上一篇文章中介绍了weex-toolkit这一脚手架工具，现在介绍以下该脚手架提供的一些命令。
1.1 create
weex create weex-demo //创建weex项目
1.2 preview
该命令会在浏览器中一观察模式打开hello.vue编译后生成的页面，这意味着你此时修改代码能够触发重新编译。
weex preview hello.vue // 预览.vue文件
1.3 compile
理解不足，暂时留白
weex compile [source] [dist] [options]
1.4 platform
理解不足，暂时留白
weex platform add ios
weex platform remove ios
1.5 run
理解不足，暂时留白
weex run ios
weex run android
weex run web
1.6 debug
该命令能够打包指定的vue文件，并在浏览器中启动一个服务，在其中调试js源代码
weex debug
上述命令会去安装weex debug的包，安装完成会自动打开浏览器
此处会踩到的坑：
- 执行weex-debug命令提示类似以下的报错信息：
这可能是因为npm包安装不完整
解决方法：
npm cache clean --force
- 执行weex-debug命令会启动下载，且下载卡住
解决方法：
ctrl + c 终端下载，执行上一条操作 - 执行weex-debug命令启动下载，下载缓慢
暂无解决方案，耐性等待吧
解决所有问题后出现以下画面
手机下载 weex playground
点击扫码，跳转如下页面
左侧展示的就是当前手机weex playground应用的实时状况了
2. 使用weex debug 调试页面
执行以下命令，调试src目录下的index.vue文件
weex debug src/index.vue
进入该页面，点击图中二维码，手机扫码，即可在Inspector中看到预览效果了。
此处可能会踩到的坑：
- 扫码后手机跳转页面白屏
原因：- 手机与电脑未连接同一wifi
- 手机和电脑连接了非开放的wifi
踩完所有坑后，我们来认识一下工具栏上的这些功能：
1. JS Debug
开启后可在调试工具的source标签下对js文件进行调试
2. Network
开启后可在调试工具对network标签下查看http请求
3. LogLevel
设置调试工具console标签下的显示等级
- debug： log的别名
- log：显示所有log信息
- info：显示info等级及以上的log信息
- warn：显示warn等级及以上的log信息
- error：显示error等级及以上的log信息
4. ElementMode
设置调试工具element标签下的元素展示方式
- native：编译后在android或ios展示的元素结构
- vdom：编译前原始的dom结构