【UniApp】-uni-app -打包成小程序


风晓
风晓 2023-12-29 10:47:20 54140 赞同 0 反对 0
分类: 资源
在上一节文章中,我给大家详细的介绍了如何将我开发好的项目打包为网页。 趁热打铁,在来一篇文章,给大家详细的介绍如何将项目打包为小程序。

正文

  • 打开微信小程序呢,其实还是需要进行一些相关的配置的
  • 首先打开微信小程序的配置页面找到 manifest.json 文件
  • 打开 manifest.json 之后找到 微信小程序配置

配置微信小程序AppID

  • 在微信开发者工具中申请获取
  • 我们的项目打包,上传到微信小程序中,需要告诉微信小程序开发者是谁,所以说需要配置一下AppID

  • 然后将 ES6转换ES5/上传代码时样式自动补全/上传代码时自动压缩 都勾选上

配置完毕之后呢,就可以进行发行了,点击 HBuilderX 工具栏中的 发行 -> 小程序-微信(仅适用于uni-app)

点击了之后再弹出来的弹框中,只要你之前配置好了微信小程序的内容,会自动为你填充,直接点发行:

打包之后会自动给你打开微信小程序开发工具:

当我运行起来之后发现,输入框的样式有问题,我来一张图来对比一下网页VS小程序:

尺寸和网页版的不一样,不对的话这里我需要修复一下,这里就是 UniApp 的一些坑。

UniApp 的坑

  • UniApp 看上去比较方便,其实内部的问题还是比较多的
  • 那么遇到这种问题我们该如何去解决呢?

比较传统的方式就是百度,可以问AI,等等,因为这里我已经百度询问过了,就不用去百度了,已经有经验了,我直接给大家上代码解决方案即可。

解决方式很简单就是将我之前写的 height: 30%;,改为 min-height: 180rpx; 即可:

  • 重新发行,查看效果:

发布小程序

通过如上内容之后就没问题了,都没问题之后,就可以发布了,点击微信小程序工具中,右上角的详情,可以针对自己的项目,进行一些相关的配置,因为我们自己的这个项目没有访问网络,所以我是不需要配置的。

如果需要访问网络就可以进行配置一下相关内容。

都弄完之后只需要点击微信小程序工具中,右上角的 上传:

上传之后在回到小程序的官网:https://mp.weixin.qq.com/,登录自己的账号,选择小程序登录而不是公众号,关于账号的注册等知识这里不介绍:

登录之后,找到管理菜单中的版本管理:

体验版本

首选是设置为体验版本:

点击提交:

提交之后,他会给你一个二维码,这个时候你就可以扫码进行体验你的小程序了:

提交审核

体验完毕之后就可以提交审核了,提交审核前需要设置小程序上线主营类目功能,然后才可以进行提交,小程序上线主营类目功能这里不介绍大家自行了解。

如果审核通过了会跑到审核版本当中:

发布版本

发布之后就变成线上 App 正在使用的版本了:

如果您发现该资源为电子书等存在侵权的资源或对该资源描述不正确等,可点击“私信”按钮向作者进行反馈;如作者无回复可进行平台仲裁,我们会在第一时间进行处理!

评价 0 条
风晓L1
粉丝 1 资源 2038 + 关注 私信
最近热门资源
银河麒麟桌面操作系统备份用户数据  127
统信桌面专业版【全盘安装UOS系统】介绍  122
银河麒麟桌面操作系统安装佳能打印机驱动方法  114
银河麒麟桌面操作系统 V10-SP1用户密码修改  105
最近下载排行榜
银河麒麟桌面操作系统备份用户数据 0
统信桌面专业版【全盘安装UOS系统】介绍 0
银河麒麟桌面操作系统安装佳能打印机驱动方法 0
银河麒麟桌面操作系统 V10-SP1用户密码修改 0
作者收入月榜
1

prtyaa 收益393.62元

2

zlj141319 收益218元

3

1843880570 收益214.2元

4

IT-feng 收益209.03元

5

风晓 收益208.24元

6

777 收益172.71元

7

Fhawking 收益106.6元

8

信创来了 收益105.84元

9

克里斯蒂亚诺诺 收益91.08元

10

技术-小陈 收益79.5元

请使用微信扫码

加入交流群

请使用微信扫一扫!