Open littleseven opened 8 years ago
weex devtools是专门为weex定制的一款实现了Chrome Debugging Protocol的inspect/debug工具,能够帮助你快速查看app运行状态和调试weex中的Javascript代码,当前支持IOS和Android两个平台。
$ npm install -g weex-toolkit
weex debug [options] [we_file|bundles_dir]
选项:
-h, --help 显示帮助 -V, --verbose 显示debug服务器运行时的各种log -v, --version 显示版本 -p, --port [port] 设置debug服务器端口号 默认为8088 -e, --entry [entry] debug一个目录时,这个参数指定整个目录的入口bundle文件,这个bundle文件的地址会显示在debug主页上(作为二维码) -m, --mode [mode] 设置构建we文件的方式,transformer 最基础的风格适合单文件,loader:wepack风格 适合模块化的多文件.默认为transformer
$weex debug
单纯启动一个调试服务器,并同时唤起chrome浏览器打开调试主页. 这个调试主页上会有一个二维码,使用Playground App扫这个二维码可以开启Playground调试. 开启调试后,设备列表中会出现您的设备,根据提示进行后续的调试操作
调试主页
$weex debug your_weex.we
这个命令会将your_weex.we编译成bundlejs文件 部署到debug服务器 并启动debug服务器如上述命令那样.打开的调试主页会多显示一个二维码,使用playground app 扫这个码可以加载your_weex.we.(注意要先扫描开启调试的那个码) 这个命令会自动检测your_weex.we文件变动,如果发现内容被修改则立即重新编译部署,并刷新debugger页面 .
$weex debug your/we/path -e index.we
这个命令会编译你指定目录下的所有的we文件,并把编译好的bundlejs部署到debug服务器,他们的地址会映射到 http://lcoalhost:8088/weex/ 下 比如 your/we/path/index.we 可以通过http://lcoalhost:8088/weex/index.js访问 your/we/path/demo/test.we 可以通过http://lcoalhost:8088/weex/demo/index.js
index.we
demo/test.we
-e参数可以指定一个入口的we文件,这个文件的地址会显示在调试主页上(作为二维码)
Inspector 能够用来查看 Element \ NetWork \ Console log \ ScreenCast \ BoxModel \ Native View 等。
Element
NetWork
Console log
ScreenCast
BoxModel
Native View
调试器用来调试weex中的js代码,能够设置断点、查看调用栈。
@all devtool 功能即将推出... 已发布。
Devtools
weex devtools是专门为weex定制的一款实现了Chrome Debugging Protocol的inspect/debug工具,能够帮助你快速查看app运行状态和调试weex中的Javascript代码,当前支持IOS和Android两个平台。
安装
用法
weex debug [options] [we_file|bundles_dir]
选项:
开启调试
单纯启动一个调试服务器,并同时唤起chrome浏览器打开
调试主页
. 这个调试主页
上会有一个二维码,使用Playground App扫这个二维码可以开启Playground调试. 开启调试后,设备列表中会出现您的设备,根据提示进行后续的调试操作调试 we文件
这个命令会将your_weex.we编译成bundlejs文件 部署到debug服务器 并启动debug服务器如上述命令那样.打开的
调试主页
会多显示一个二维码,使用playground app 扫这个码可以加载your_weex.we.(注意要先扫描开启调试的那个码) 这个命令会自动检测your_weex.we文件变动,如果发现内容被修改则立即重新编译部署,并刷新debugger页面 .调试整个bundle/we文件夹
这个命令会编译你指定目录下的所有的we文件,并把编译好的bundlejs部署到debug服务器,他们的地址会映射到 http://lcoalhost:8088/weex/ 下 比如 your/we/path/
index.we
可以通过http://lcoalhost:8088/weex/index.js访问your/we/path/
demo/test.we
可以通过http://lcoalhost:8088/weex/demo/index.js-e参数可以指定一个入口的we文件,这个文件的地址会显示在
调试主页
上(作为二维码)特性
连接设备
Inspector
Inspector 能够用来查看
Element
\NetWork
\Console log
\ScreenCast
\BoxModel
\Native View
等。Element
NetWork
查看网络请求的总耗时和延时
查看网络请求的header和response
控制台
资源
Debugger
调试器用来调试weex中的js代码,能够设置断点、查看调用栈。
Breakpoint and CallStack
集成devtools