【Uni-App社区小程序】003-多端调试环境配置

一、安卓真机调试配置

1、步骤

第一步:打开手机的开发者模式

不同的手机存在一些差异,这里不再细述,如果真的有问题,请善用百度解决;

第二步:使用USB数据线将手机与电脑连接

此时电脑会有手机连接的提示信息;

第三步:打开项目中的index.vue文件

【Uni-App社区小程序】003-多端调试环境配置

第四步:点击菜单栏的“运行”,如下图

【Uni-App社区小程序】003-多端调试环境配置

第五步:项目进入编译状态

【Uni-App社区小程序】003-多端调试环境配置

第六步:根据手机提示操作即可,结果如图(荣耀20)

【Uni-App社区小程序】003-多端调试环境配置

 

二、IOS真机调试配置

(由于本人使用的是基于Android系统的荣耀20手机,没有也从未使用过基于IOS系统的苹果手机,这里暂不做演示,请见谅!但真机调试的方法一般都不是太复杂,有需要的朋友可通过百度搜索,按照常规真机调试步骤进行相关操作。)

 

三、微信小程序调试配置

1、微信小程序开发环境搭建

第一步:下载微信web开发者工具

网址:https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html

下载流程图:

【Uni-App社区小程序】003-多端调试环境配置

 

2、安装微信web开发者工具

常规软件安装流程,步骤如下:

第一步:点击“下一步”

【Uni-App社区小程序】003-多端调试环境配置

第二步:点击“我接受”

【Uni-App社区小程序】003-多端调试环境配置

第三步:选择安装路径,推荐D盘

【Uni-App社区小程序】003-多端调试环境配置

 

3、微信web开发者工具的设置

如果是第一次使用微信web开发者工具,那么需要随便创建一个小程序,进入到小程序页面进行设置,创建小程序填写APPID时点击下方的测试号即可;如果之前已经使用过微信web开发者工具创建过项目,那么直接打开之前的项目,进入第二步即可。

第一步:新建微信小程序项目

【Uni-App社区小程序】003-多端调试环境配置

第二步:打开小程序项目,进入小程序开发页面,依次点击*菜单栏中的“设置——安全设置”

【Uni-App社区小程序】003-多端调试环境配置

第三步:打开“服务端口”即可

【Uni-App社区小程序】003-多端调试环境配置

 

4、微信小程序调试

第一步:启动调试

【Uni-App社区小程序】003-多端调试环境配置

第二步:此时项目进入编译阶段

【Uni-App社区小程序】003-多端调试环境配置

第三步:成功在微信web开发者工具运行

【Uni-App社区小程序】003-多端调试环境配置

 

四、支付宝、头条、百度、QQ小程序调试配置

(本教程仅对Android真机调试和微信小程序调试,其他平台请参考uni-app官方文档)

官方文档地址:https://uniapp.dcloud.net.cn/