伴随着weex的正式开源，对一款针对weex框架的简单易用的调试工具的呼声也日趋强烈。weex devtools就是为weex前端和native开发工程师服务的一款调试工具，可同时检查weex里dom属性和javascript 代码断点调试，支持ios和android两个平台。
devtools可以动态检测客户端的连接绑定请求，同时连接／调试多个device(或者模拟器)是很容易的事情。连接的客户端显示在“device list"界面，如下图所示。点击对应device的debugger按钮即开始调试流程，并弹出js断点调试的页面；随后点击inspector按钮可弹出调试dom的页面。
devices")
这个是用来调试weex中的js前端代码的页面，“sources” tab能够显示所有js源码，包括jsframework和bundle代码。可以设置断点、查看调用栈，功能和普通的chrome浏览器调试一样。"console" 控制台显示前端的log信息，并能根据级别（info/warn/error等）和关键字过滤。
inspector 功能丰富，能够用来查看 <code>element</code> <code>network</code> <code>console log</code> <code>screencast</code> <code>boxmodel</code> <code>native view</code> 等。
这里展示的是在android／ios上的native dom树，及其style属性，和layout图。鼠标在dom 树移动时，在device（或模拟器）上对应节点会高亮显示，有助于native开发者定位和发现节点。screencast只是对屏幕图像拷贝，在远程调试时能看到远程设备界面,数据网络下screencast也将有较大流量花销,,如果设备就在手头儿则建议关掉。
这里展示的是bundle资源加载网络访问的性能。所以如果bundle资源在device本地，network是没有数据的。
查看网络请求的总耗时和延时
查看网络请求的header和response
这里显示的是android／ios上的native log，并不是前端log（显示在debugger页面）。同样native log也有对应级别--warn/error等，和关键字过滤，native开发查询很方便。
这里和network一样，远端访问的资源文件会显示在这里，没有实际作用。因为在debugger页面，"sources"里已经有源码并可以断点调试。不过假如你的应用里有数据库文件，在这里可以方便的查看而无需root，这是非常有用的。
weex debug [options] [we_file|bundles_dir]
选项:
前提:
安装weex-toolkit, 内含调试命令weex debug
android／ios设备及pc已联网,若位于不同网段请确保防火墙可访问性
调试步骤:
启动debug server.
执行命令<code>weex debug</code>将启动 debug server.如果启动成功将会在chrome打开一个welcome页面,在网页下方有一个二维码.
启动playground并扫码.
点击启首页左上角的扫码按钮扫码上一步中网页下方的二维码.此时welcome页面将会出现你的设备信息.playground进入loading页面,等待你的下一步操作.
点击网页上的debugger按钮.
app结束loading进入debugging状态.同时chrome将会打开debugger页面.按照页面提示打开该页的javascript控制台并进入source tab.
设置断点刷新当前页.
点击playground首页list中的任意项将打开一个weex bundle,此时在sources里会出现相应的js 文件，设置断点并刷新playground 即可调试.
点击网页上的inspector 按钮.
chrome会打开inspector页面，可以查看element, console, network状态.
如果是接入weex的应用想调试自己的bundle代码，有以下几个方式：
借助playground扫码调试we文件
先确定playground已经是可调试状态
执行weex-toolkit 命令，"weex debug xxx.we"，会自动编译打包we文件，并在chrome的device 列表页面最底下新生成一个二维码。
用playground扫描新二维码，手机上即显示xxx.we的结果。相应在"debugger"和"inspector"页面调试。
借助playground扫码调试js bundle文件
用二维码生成器为xxx.js 生成一个二维码。
用playground扫描新二维码，手机上即显示xxx.js的结果。相应在"debugger"和"inspector"页面调试。
直接修改应用，接入devtools接口
<a href="https://github.com/alibaba/weex/tree/dev/android/inspector">android sdk接口</a>
<a href="https://github.com/alibaba/weex/tree/dev/ios/wxdevtool">ios sdk接口</a>