开发小程序时，可以在开发者工具中进行调试。 开发者工具提供了类似的调试面板，对于前端开发者来说入门门槛相对较低。

小程序开发完成后，我们需要在真机上进行测试。 在真机调试方面，小程序开发者工具具有预览、远程调试、设置体验版三大功能。 除了这三种方法之外，我们还可以使用真机远程调试。 在iOS上，我们可以实现调试代码。 在中，我们可以安装X5内核版本并开启该模式。 使用真机调试不仅可以发现开发者工具中找不到的bug，还可以帮助我们理解小程序的运行原理。

下面介绍如何使用来真机在iOS上调试小程序。

我们简单说一下原理。 首先，下载脱壳版的微信ipa文件（iOS App程序的后缀），然后用自己的账号重新对ipa进行签名。 最后将项目编译到真机（也可以模拟器）上，就可以用来调试了。

下载项目使用PP助手下载脱壳版的微信ipa（使用最新版本的微信，否则登录时会提示升级）。 这就需要安装PP助手。 下载后，在下载目录中找到其ipa，并将微信ipa文件命名为app。 .ipa，替换目录下的/app.ipa文件，用它打开项目，修改签名为自己的开发者账号。 如果您没有开发者帐号，可以使用自己的帐号登录。

按照上面的提示，先修改一下（这里可以随意填写），然后用自己的ID登录账户，然后选择自己的真机（数据线连接好后就可以选择） 。 选择后，点击开始编译。 编译完成后，会安装到您的手机上，安装成功后，您会发现您的手机上有两条微信消息。

然后完成以下步骤来调试小程序。

信任您自己的开发人员配置文件：“设置 -> 常规 -> 配置文件 -> 信任您的证书” 打开调试：“设置 -> -> 高级 -> Web 检查器打开”

首先，登录微信账号，打开需要调试的小程序，打开后在Mac电脑上打开“->开发”找到你的手机，选择对应的页面进行调试。

这里解释一下：

调试

打开后发现第一个JS文件其实是微信的逻辑层代码.js：

另外我看到有些代码其实是实现了一些方法或者事件，然后调用方法返回数据。 下面是点击事件的截图。 您将看到点击事件传递的数据。

调试页面-.html

page-的页面是一个普通的容器小程序开发版需打开调试，可以直接放入其中。 下面我打开了我正在开发的项目，通过面板修改了#-节点的内容：

修改完成后，在手机上可以看到效果：

这说明DOM操作其实是可以进行的，普通的BOM对象也可以使用，比如等等。

使用查看 UI 布局

如果想研究微信小程序的布局，可以使用软件查看UI布局。 如下图所示，在今日头条小程序的布局中，可以看到播放器组件是实现的组件，我们制作的清新天气小程序的雨雪效果也是实现的。

要启用它，您需要执行以下步骤：

安装它，然后通过菜单“帮助 -> 显示于 -> iOS”打开它。 将目录复制到//

如果以上两步正确的话，再次使用Open and Run。 打开小程序后就会看到可以操作了。

此时，点击图标即可随意查看UI布局。

商业时间

最近，由于小程序云开发的推出，我发现使用云开发可以大大降低小程序开发的门槛。 过去我想到的很多想法往往因为缺乏后端知识或者缺乏后端服务器而没有实现。 现在我使用小程序云开发提供的接口是完全可以实现的。

于是我利用云开发的API实现了一个“新鲜天气”小程序，并将我的开发过程和更好的经验整理成一本电子书，发布在腾讯云学院上。 《天气查询小程序0到1实现》。

本实践课程重点围绕搭建一个具有天气预报、打卡功能的小程序，从基础知识到小程序运行机制，从开发环境搭建到小程序开发、调试、上线，打通微信小程序的全流程程序开发。 让新手从头开始完成并启动一个小程序。 主要由以下三部分组成：

当然，这个实践课程收取一部分费用，但价格相对便宜。 希望对想要学习或者正在开发小程序的你有所帮助。