关于weex的一些操作

本文介绍如何使用Weex-toolkit及weex-devtool-extension进行Weex应用的开发与调试,包括解决5037端口占用问题、安装调试工具、配置Chrome扩展程序等步骤。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

我们使用如下的命令检查5037端口

adb nodaemon server

这里会提示

cannot bind 'tcp:5037'

5037端口被占用了

C:\Windows\System32\cmd.exe /k "D:\nodejs\nodevars.bat"

npm install weex-toolkit -g  安装模块 

安装weex-ui 命令
npm i weex-ui -S

weex debug --调试

weex-devtool-extension
weex debug -v

weex debug src/pages/Home.vue //调试一个页面
weex-devtool-extension
A extension for Weex devtool to improve your debug experience,which equivalent an element tag for debugger page. #download weex-devtools-chrome-0.0.6.zip

#useage

下载crx文件
打开chrome浏览器的菜单,选择【更多工具】->【扩展程序】进入扩展程序界面
把crx文件拖到扩展程序页面里,点击安装(此方法已失效,新版本chrome会自动禁用第三方安装的extension)
下载zip文件,并解压到任意目录。
打开chrome浏览器的菜单,选择【更多工具】->【扩展程序】进入扩展程序界面,并勾选开发模式
选择【加载已解压的扩展程序】选择你刚才解压出来的那个目录【weex-devtool-extension】完成安装
确保你的weex devtool的版本在0.2.46以上(通过weex debug -v查看)如果版本过低请使用npm install -g weex-toolkit升级。
打开weex debug,连接设备调试,建议ElementMode选择vdom。
打开debugger页面。打开devtool调试器,点击weex tab
###深度检查工具 weex tab的下方有一个Node Deep Validator 用于检查当前Node tree的一些过深的节点和需要优化的情况(目前是div嵌套)   点击validate按钮会对当前的Node tree进行深度检查
,超过警戒值的节点的整个路径上的节点都会标记高亮(警戒值可以通过下面那个输入框设置 默认是10层)   另外 DIV嵌套的情况(即一个div套了一个div且这个div是其唯一子节点)也是会标记为高
亮(即使深度没有超过警戒值)
P.S. Node tree里的deep属性是最大深度level的意思 本身是我了我自己调试用,所以不要依赖这个属性(标记div嵌套的时候我做了处理 那个值不是真实值)
 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值