00:00
好在上一节课给大家讲解了如何配置这个开发,那这节课我们来回顾一下官方的这个,诶文档如何去看,那你要看这个文档主要看这四个部分,首先是整个的一个介绍,是所有的一个概览,包括我们要看到条件编译以及其他平台要使用的一个,呃,注意的一个事项。它的一些规范都是在这里面去看,那我们想要对UNAPP它提供的框架有些了解啊,比如说进行一些啊配置相关的,以及这个框架接口相关的这些东西的话,你就可以看这个框架啊,去主要的话就是在这里面去看这个配置啊,那我们要用这个UNAPP的一些组件的话,就去组件这里面去看,那如果要用到用APP的呃,一些API的话,就去API里面去看啊,所以文档呢,写的还是比较规范。嗯,说完这个文档之后,那这节课我们主要的内容是来学习一下诶如何去部署各个测试环境,因为我们在开发完这个代码之后,需要去,呃,运行各个平台的一个测试。那这一块主要说一下各个平台如何去测试,首先说一下H5平台,H5平台就是我们在这个浏览器中如何去测试,这个我们用的比较多,对吧?那如果你不能直接打开这个谷歌浏览器,我们可以在这个,诶这个偏好设置里面。
01:13
去对这个呃,运行配置进行一些设置啊,比如说我们找到这个浏览器的一些云配置,谷歌的这个安装路径,以及这个火狐的安装路径等等,如果你不能自动去打开这个谷歌浏览器,那我们在这里去选择这个浏览啊,点击浏览选择对应的啊,这个谷歌程序所在的一个地方就可以了。一般情况下,我们不用对这个浏览器进行默认的一个设置啊,可以直接去运行,当你出现不能在浏览器中运行的情况的时候,我们再去这个设置里面,把我们的这个运行配置找到浏览器啊,相关的运行配置进行一下路径的一个设置啊。好,设置完成之后,就可以在我们的项目啊,然后来到我们的这个项目,你就可以点击这个运行,可以运行到我们的这个浏览器,也可以选择这个浏览器。
02:01
然后在下面你也可以诶,就说右键重新运行以停止运行,在这边也可以去进行一些操作啊。那这是关于在浏览器中调试,那接下来说一下如何在这个,呃,如何使用这个安卓模拟器,安卓模拟器呢?呃,我们来看一下啊,你要使用安卓模拟器,首先你电脑上在安装一个安卓模拟器,那我这里呢,使用的是这个网易的这个MU,那我先把它打开,把这个模拟器打开之后。呃,我们再去点这个运行。等一下啊,等它完全启动,我们再去点这个运行就可以看到啊,这有一个安卓的模拟器啊,现在还没有运行起来,等一下它启动之后,可以看到这里有一个安卓设备,那当然这是我配置好的啊,所以可以直接去它会检测到这个设备,我们就可以直接啊在这个模拟器里面去运行。可以看一下这个效果。等它编译完成啊,等它这里编译完成。
03:00
好就可以看到啊,在这个模拟器里面去运行,然后把这个给关掉。因为我这里使用的是Mac OS的一个系统,这里可以调成竖屏啊,所以呢,呃,关于这个模拟器如何配置呢。跟大家如果是Windows的话,可能会有不一样,那关于如何配置这个安卓模拟器,我们来到官方的这个文档,你去文档里面直接搜这个安卓模拟器,会有很多的这个教程,教你如何去配置,这里就不再说了啊,安卓模拟器给大家稍微看一下,你搜索,然后你去找这些,呃,就是说浏览比较高的,比如说像这个两两万多的和1万多的都是可以啊,比如说我们点开一个可以看到这里给的非常详细,有这个图文的一个教程,大家按照教程去。一步一步走下来,就可以把这个安卓模拟器给配置好。啊,如果这个文章不太行的话,你可以再去看一下其他的一个文章啊,这个应该也是可以的啊,因为你看下面的这个评论应该是,呃,没有说有问题的啊,就是可以用的啊。好,那这是关于如何配置这个安卓模拟器。
04:04
接着来看我们的这个项目,先把这个模拟器给关掉啊。好。这里可以调成这个竖屏。屏幕旋转啊之后我们再重新进入我们的这个应用,它就是竖屏的一个应用,在这里面呢,可以调试我们在模拟器中的啊,显示的一个效果,我先把那个关掉啊。那接下来说完这个安卓模拟器,再说一下这个iOS模拟器,IOS模拟器的话要调试比较麻烦,如果是你是Mac平台的话,呃,麦克的话会有这个插库的。我给大家打开一下这个叉扣的。啊,会有这个插库的工具,它带了这个各个苹果系统的一些模拟器,我们可以直接在这里面项目里面去运行到指定的这个模拟器,比如说这个苹果12的啊,当然这个模拟器呢,也是可以选择这个版本的啊。就是Mac系统,如果是Windows系统,你可能需要借助一些其他的一些工具,比如说助手啊这样的啊。
05:02
大家可以去看一下,网上会有很多的一个教程。然后我说一下这个插扣的。你在插库的启动之后呢,我们这个H它是连不上这个插库的,你需要对这个插库的进行一个设置啊,来找一下设置。然后找到这个locations这个位置,把这个啊,Comment tos把这个给选上啊,一开始是没有选中的,你把它勾选上之后,我们的h build就可以和我们的插库的进行通讯,就可以在这里运行的时候选择我们的手机模拟器,可以运行到指定的iOS的一个模拟器,然后就可以,呃,看一下我们的应用在iOS平台运行的一个情况。等一下他启动之后,我给大家看一下。现在还正在启动模拟器。启动完成之后,这里就会多出来一个模拟器,然后我们的应用就会在这个模拟器上去运行。那这是我们已经说了三个了,如何在H5上去测试,如何在安卓模拟器上去测试,以及这个啊iOS模拟器上去测试。
06:07
啊,Windows电脑的话就是在iOS上测试会比较麻烦。好,那我们先把这个给关掉,那接下来我们再来说一下如何在微信小程序上,其实是在前面的一节课,我们讲这个生命周期的时候用到的微信小程序的开发工具,对吧?那我们如果想要在微信小程序里面啊,微信开发者工具里面去测试我们这个应用的话,测试小程序的一个呃效果的话,那么你首先需要啊,去安装这个微信开发者工具啊,我来找一下。呃,微信。开发者工具。好。然后找到这个就是说微信开发者工具之后,在这个微信开发者工具的这个设置里面啊,我们找一下这个安全设置,你要在这个安全设置里面。把这个端口号给打开啊,等一下现在加载点慢,要把这个服务端口号给打开,这样的话,呃,就可以通过这个命令行和V去调用开工具,这样的话的就能通讯到我们的开发者工具,那这一步进行之后呢,还要对我们的这个h build的进行一个配置,哎,还是找到偏好设置。
07:16
然后还是这个运行配置这里啊。然后我们之前是看了浏览器的运行配置,那这里呢,我们继续看小程序的这个运行配置,那主要呢,就是配置这个微信开发者工具的一个路径啊,就是说如果我们在呃这里去运行的时候,运行到这个小程序模拟器,如果不能正常的打开微信开发者工具,那我们要把这个路径选对啊,选择你微信小程序阿发的那个安安装的那个路径,那一般呢,你是不用配置默认就可以,大家可以看到我这里并没有配置,然后我在启动的时候就可以直接在小程序里面去运行,现在我来运行一下,运行到小程序模拟器,微信开发者工具。啊,一般是不用配置,当然你要说是这个你的电脑啊,出现了一些问题,找不到这个啊路径没有办法自动打开这个开发者工具的时候,你可能要。
08:03
手动指定一下啊啊,也是浏览,然后选择到你的这个微信开发的工具安装的那个目录,找到那个点exe可执行的那个文件就可以了啊,如果是麦克直接找到这个APP里面的啊,那个点APP就可以啊,点APP开尾的开结尾的这个微信开发者工具就可以啊。那这个是关于呃。微信开发者工具的一个配置。等它加载完成就可以看到我们这个效果,诶我们的这个效果有了啊,当然这些是我们在循环的时候,我们有指定这个K造成的,我们先不用管这些。那说完微信开发者工具的这个测试之后啊,我先把它关掉,先把这些开头都关掉,我们再来说一下如何增肌测试,那增肌测试呢。这里我以安卓手机为例,那首先你要找到一根数据线,把你的手机和电脑用数据线连接起来,那接下来在你的手机里面找到这个设置啊,因为我现在没法连接本机,我就拿这个模拟器给大家说,然后就是在你手机里面找到这个设置,找到关于这个电脑啊,就是关于你的手机这一项,因为这是个平板的模拟器,找到关于手机这一项,找到你的系统版本号。
09:15
然后去诶双击几次就可以打开这个开发者模式,当然每个手机不一样,你具体是什么型号的手机,你去啊,自己去网上去查,就是你这个型号的手机如何打开,就是说开发者模式,那打开开发者模式之后,然后。呃,这个HB的就可以去和我们的真机进行一个通讯,我们在第一次运行到这个真机上的时候,它会去安装一些这个,呃,它需要安装的一些内容,等他安装完就可以了。在手机上设置没有问题之后,我们再点项目运行的时候就能,哎,比如说运行到手机或模拟器,我们是先来到这个项目啊,才能点这个运行。这时候再运行到手机或者模拟器,就可以看到我们的,呃,真机的一个设备就不再是这个模拟器了啊。
10:01
那这个是关于安卓真机的,因为每个手机的设置都不一样,所以呢啊这里呢,我使用这个模拟器只是给大家做一个参考,因为每个手机的它打开这个开发者模式的这个方式都不一样啊,这个大家要注意,可以自行去查阅自己手机如何打开开发者调试模式。好,那这节课呢,主要给大家大家讲了如何在各个平台,就是各个端去进行我们的啊调试啊,当我们开发完项目之后,需要对各个平台进行一个测试啊,如果有一些不太合适的地方,就可能还要写一些兼容性的代码,或者说调整一下呃这个bug,然后我们再来看一下这个文档,找到这个介绍这里啊。这里面有一个呃,跨端开发的一个注意,这里面列举了所有就是跨端需要避免的一些事项啊,我们在比如说是开发小程序的时候,你可以在下面找到啊,比如说在开发小程序的时候需要注意的一些事项,我们来在这里面找到这里啊,小程序开发注意然后。
11:01
包括这个,呃,下面的这个微信小程序的这个已知的这个bug的列表,我们最好去过一下,在开发微信小程序,可以就是说尽可能的避免已有的已知的一些方法啊,然后你如果是开发这个APP的话啊,也去看一下各个这个平台的这个这个APP的一个差异性。那这个就是呃,关于我们这个用APP所有的一些基础知识给大家整理完了,那在接下来的课程就开始我们的项目。好,那这节课先到这里。
我来说两句