上一节,我们已经把微信小程序开发所必须的都已准备好
这一节 ,我们将 了解 微信开发者工具的基本使用,以及各项功能
这里我们不讲公众号网页调试
这款 ide 基本功能 有如下三点
小程序调试(开发者可以完成小程序的 API 和页面的开发调试)
代码查看和编辑
小程序预览和发布等
至于 最新版本添加的
使用腾讯云,快速搭建小程序后台运行环境; 申请测试报告,了解小程序在真实的移动设备上运行性能和运行效果。我们暂不使用
菜单栏
微信开发者工具选项
切换账号:快速切换登录用户
关于:关于开发者工具
检查更新:检查版本更新
开发者论坛:前往开发者论坛
开发者文档:前往开发者文档
更换开发模式:快速切换公众号网页调试和小程序调试
退出:退出开发者工具
调试:
调试开发者工具 ,调试编辑器
作用就是通过浏览器 调试工具 进行外部调试 该ide
项目
新建项目:快速新建项目
打开最近:可以查看最近打开的项目列表,并选择是否进入对应项目
查看所有项目:新窗口打开 启动页 的项目列表页
关闭当前项目:关闭当前项目,回到启动页的项目列表页
文件 不多介绍
编辑
可以查看编辑相关的操作和快捷键
工具
编译:编译当前小程序项目
刷新:与编译的功能一致,由于历史原因保留对应的快捷键 ctrl(⌘) + R
编译配置:可以选择普通编译或自定义编译条件
前后台切换:模拟客户端小程序进入后台运行 和 返回前台的操作 ,可选择不同场景来进行模拟
清除缓存
需要注意的是:
在最近版本的ide中添加了后面几个选项
将在后面一一讲解
界面
控制主界面窗口模块的显示与隐藏
设置
外观设置:控制
编辑器的配色主题、字体、字号、行距(感觉 模仿的VS code)
编辑设置:控制文件保存的行为,编辑器的表现
代理设置:选择直连网络、系统代理和手动设置代理
通知设置:设置是否接受某种类型的通知
工具栏上的东西 其实在菜单栏中都有,只不过为了方便单独拿出来 ,做成按钮 ,方便使用,这里不介绍
下面是一些,常用功能介绍
打开已创建好的项目
非空目录下 必须存在
app.json 或者 project.config.json
项目
工具支持同时打开多个项目
每次打开的项目会从新窗口打开
- 首先 点击标题栏的项目选项 ,后展开如下
当 需要 * 管理(删除)项目*时
点击 查看所有项目 ,然后会弹出一个新的窗口
在上面的界面中 ,点击管理项目 ,便能删除,添加项目
当 需要 多开项目时
选择添加项目 即可 在新窗口中 开始新项目的 代码编辑
此时 便可以选择 新建一个项目 或者 是 按上面的不走打开一个 已创建的项目
模拟器
模拟器可以模拟小程序在微信客户端的表现。小程序的代码通过编译后可以在模拟器上直接运行。
开发者可以选择不同的设备,也可以添加自定义设备来调试小程序在不同尺寸机型上的适配问题。
在模拟器底部的状态栏,可以直观地看到当前运行小程序的场景值,页面路径及页面参数













