大家好,我是 BNTang, 在上一节文章中,我给大家详细的介绍了如何将我开发好的项目打包为网页。
趁热打铁,在来一篇文章,给大家详细的介绍如何将项目打包为小程序。
manifest.json
文件manifest.json
之后找到 微信小程序配置
ES6转换ES5
/上传代码时样式自动补全
/上传代码时自动压缩
都勾选上配置完毕之后呢,就可以进行发行了,点击 HBuilderX 工具栏中的 发行
-> 小程序-微信(仅适用于uni-app)
:
点击了之后再弹出来的弹框中,只要你之前配置好了微信小程序的内容,会自动为你填充,直接点发行:
打包之后会自动给你打开微信小程序开发工具:
当我运行起来之后发现,输入框的样式有问题,我来一张图来对比一下网页VS小程序:
尺寸和网页版的不一样,不对的话这里我需要修复一下,这里就是 UniApp 的一些坑。
比较传统的方式就是百度,可以问AI,等等,因为这里我已经百度询问过了,就不用去百度了,已经有经验了,我直接给大家上代码解决方案即可。
解决方式很简单就是将我之前写的 height: 30%;
,改为 min-height: 180rpx;
即可:
通过如上内容之后就没问题了,都没问题之后,就可以发布了,点击微信小程序工具中,右上角的详情,可以针对自己的项目,进行一些相关的配置,因为我们自己的这个项目没有访问网络,所以我是不需要配置的。
如果需要访问网络就可以进行配置一下相关内容。
都弄完之后只需要点击微信小程序工具中,右上角的 上传
:
上传之后在回到小程序的官网:https://mp.weixin.qq.com/,登录自己的账号,选择小程序登录而不是公众号,关于账号的注册等知识这里不介绍:
登录之后,找到管理菜单中的版本管理:
首选是设置为体验版本:
点击提交:
提交之后,他会给你一个二维码,这个时候你就可以扫码进行体验你的小程序了:
体验完毕之后就可以提交审核了,提交审核前需要设置小程序上线主营类目功能,然后才可以进行提交,小程序上线主营类目功能这里不介绍大家自行了解。
如果审核通过了会跑到审核版本当中:
发布之后就变成线上 App 正在使用的版本了: