模拟器
左边部分为模拟器,会尽可能地模拟移动端上的真实情况。但上线前,请在真机确认最终效果。
- 刷新:刷新模拟器
- 暗黑模式:可以在设置中切换暗黑模式。
- 多语言:切换多语言。具体参考文档。
- 机型:可以选择不同的机型进行预览。
- 缩放:可以选择不同的缩放比例进行预览。
- 授权登录:当需要模拟一些 app 能力的时间,则需要授权登录
- 模拟 app 请求的时候
- 面板小程序则必须登录
- 确保和 app 账号所属同一个城市
- app 账号是该小程序的成员
功能
工作区的顶部,会有各种功能
真机调试
- 远程模式:只需要联网,就可以在手机上运行小程序,方便调试。
- 局域网模式:与远程模式基本一致,优点是链接速度快且不受网络波动影响,缺点就是需要再同个局域网下
- iOS 需要 5.12.0 及以上版本
- Android 需要 5.15.0 及以上版本
真机调试 2.0
- 优势:与老版本真机调试相比,新版本真机调试更快速,且运行更贴近真机
- iOS 需要 6.3.0 及以上版本
- Android 需要 6.3.0 及以上版本
真机预览
通过扫码,可以在手机上预览小程序,其实就是发布小程序的开发版本
- 需要添加 app 的账号到体验白名单
- 与真机调试的区别
- 编译模式不同,真机调试是 watch,真机预览是 build,真机预览和发布更相似
- 小程序的运行效率不同,真机预览更接近发布情况
- 真机预览没有调试能力
插件
插件是 IDE 能力的扩展,可以通过打开插件,来实现更多的功能。例如:面板工具
在 VS Code 中打开
可以在 VS Code 中打开当前的项目,方便开发者进行代码编辑。需要配置 VS Code 的 code 命令。
项目设置
- 基本信息:当前项目的基本信息,也可以改变绑定的小程序
- 小程序 ID:可以跳转到对应的小程序后台
- 代码包体积:需要在发布小程序后才能看到准确的信息
- 环境配置:主要是配置小程序的基础库和依赖的 kit 版本,具体请查看基础库与 kit
- 项目配置:一些会影响编译的配置
调试区
调试区功能主要是:
- 调试:其实就是 chrome 的 devtools 的能力
- console:查看小程序运行时的 console 输出
- element:查看小程序的 dom 结构
- 等等
- 日志:可以查看编译过程的日志,部分时候可以截图输出的错误反馈错误
- 初始化项目时的编译
- 打包上传发布的编译
- 真机预览的编译