00:00
大家好,在解决完各个平台的啊差异之后,那这节课开始我们来讲一下啊,如何在各个平台进行发布,那首先我们来讲一下啊,如何在H5平台发布,那我们所有设备,呃,就是不同平台在发布的这个文件呢,是这个呃,M,那在这个里面呢,我们可以看到各个平台的一个配置的情况,那我们这里呢,是我们这个啊,用APP应用的一个ID啊,我们可以点击这里重新去获取啊好,然后是我们应用的一个名称,这个我们先不看,我们这节课看的是H5的一个配置,所以我们点到这个H5的配置这里啊,那首先有一个我们的页面的一个标题,默认的话呢,如果我们不写这个会使用我们应用的名称啊,也就是我们配置的这个应用的一个名称。好,那这里面我们可以把它给配置上,我们的图书商同好,那接下来啊,是我们的这个模板可以看到啊,那我们这里使用的这个模板是temp play的H5.htime也是这个文件啊这个文件好,那如果你不想啊使用这个模板呢,你也可以去自定义模板,那自定义模板呢?啊可以去啊参考一下这个文档如何制定这个模板,那这个模板呢?哎,为我们引入了外部的一些这个样式啊,一些公共的样式,以及啊我们的这个头部的一些配置等等。
01:13
好,那接下来是这个路由的模式,路由的模式呢啊有两个,一个是哈希,一个history,哈希的话呢,就是在我们链接后面会加上一个井号,但这样链接看起来不是特别好看啊,那如果是这个history呢?啊,那就是看起来链接就是和我们哎正常去访问的是正一样的,正常的比较正常的这种链接啊,他们之间有个区别就是如果是哈希模式的话啊,它有点类似于这个类,类似类似于一个锚点啊,然后像这个history啊,它的这个类史记录呢,就会啊写入到啊我们的这个历史记录的记录站中,我们可以通过这个返回等等啊。这是它俩的一个区别啊,其实最主要的体现就是在这个呃,UR上面,那这个我们就用history就可以,再然后是运行的一个啊基础路径,也就是说我们打包我们发行之后我们的这个目录啊,我们项目目录是在哪个目录下啊,那如果我们的项目不是部署在根目录啊,这里呢,我们就要需要去配置其他的一个目录啊,那我们这里呢啊,默认就可以啊,默认就可以。
02:15
接下来是否开启apis协议啊,这个我们开启,然后是我们的端口啊,这个不用管,那我们把这个给勾上,就是发行时启用啊摇式优化啊,这个摇水优化就是说它会呃裁剪掉我们没有用到的组件和API,可以减少我们的啊代码的体积,以及加快所谓的训练速度,我们把这个勾上好,再往后是这个定位和地图,如果我们的项目中用到了腾讯地图,我们需要把这个勾上,并且把这里填上我们在腾讯地图申请出来的这个K啊,申请的这个地图的这个API的这个K啊,如果没有用我们就不勾选了啊,那这是关于H5的一个配置,那在我们的发行配置配置完成之后啊。如我们的发行配置是在这里面,配置完成之后,我们就可以使用这个发行来打包我们的H5,来我们点一下这个发行。
03:01
啊,先选到这个项目啊,因为你可能有多个项目嘛,先选到你这个项目,然后点到这个发行,然后我们先把它啊发吧,发行这个网站的啊,因为我们现在是配的H5嘛,也是网站PC,就是外部或者说联系五啊好,我们来进行发行,好这个标题的名称啊,我们的这个域名先不用管,那接下来啊,这个呢,我们也不用用啊,我们直接是配好棉虫之后直接发行就可以了。等它边缘成啊好。等他编译啊。等它编译完成之后,我们就可以在这个安啊package里面去看到啊,我们啊这个H5的一个。一个效果啊,就是它打包后的一些文件啊,现在开始差量编译,现在还没有编译完,我先等一等。好,导出成功导出的路径为啊,Dis的build里面的H5,那我们在这个按page里面找到这个Dis里面有个build对吧?Build就是我们构建之后的一些代码,然后这里面是我们这个H5的这个代码啊好,那这个代码呢,分这么两部分,一个是我们的这个index啊,就是我们的入口文件,再一个就是我们静态资源CS,还有我们的图标都在这里面了,看到了吧,好啊,我们最终是把这个目录啊丢给这个后端的啊。
04:16
后端的团队啊,后端的人员让他去运行这个目录就可以了啊,运行这个目录就可以了啊,那关于这个项目如何部署呢?啊,这个大家再参考其他的啊,这个内容啊,我们这里就不多说啊,不多说啊,那么可以看到这个打包之后的这个。样式啊,它是压缩之后的一个代码啊,那我们可以简单的去运行一下,尝试去运行一下啊。好,我们来到这个目录啊,来到这个目录,我复制一下这个目录啊。找到这个终端。好,我们来CD进到这个目录。等一下啊,CBCD到这个目录,好,现在呢,我是在这个目录对吧,在这个目录啊,这里有我们的这个啊这个文件,这个文。
05:02
这个入口文件以及哎,我们的这个静态资源,那接下来呢,我简单的用这个serve把就是以当前的这个目录作为一个呃服务端去运行,那接下来我们去尝试一下啊,访问一下啊,那我这个访问的就是我们打包之后的一个一个东西了啊。来访问一下啊。还可以看到啊,跟我们之前在开发的时候是一样的,对吧?啊,那这个就是呃,我们打包的H5之后的一个代码啊,H5之后的一个代码可以看起来运行起来和我们在这个调试的时候开发的时候是一样的啊好,这里呢,我是简单的使用了一个小工具,一个色工具啊。把它给用起来,但实际上我们部署到服务端之后啊,可能这个页面啊,就会用,呃,一些比较成熟的一些这个服务器,像阿尔法奇N来去啊运行啊,我们的这个项目好好,那这这里呢,只是给大家演示一下啊,那我们的H5的这个发布呢,其实比较简单,简单的配置一下就可以了,那我们就说到这里啊好,这节先到这里。
我来说两句