uniapp打包发布h5、APP和微信小程序(自测体验版)
序
自测体验版没有备案过程,自行判断是否继续阅读,或者在此基础上自行发挥
一、发布前准备工作
如果是使用uniCloud提供后端服务,需上传所有云函数和DB schema,右键菜单可以上传

再次运行项目测试,调成“连接云端云函数”

bug:项目需要联表查询uni-id-users表的可读信息时提示要登录,明明该表的用户名、头像字段可读权限已经设置为true;解决方案,再次单独上传uni-id-users.schema.json即可。
二、发布H5
找到项目里的manifest.json文件,设置应用名称、路由模式和运行路径

bug:uniapp项目点击发行网站或H5按钮没反应

解决方案:先点发行-小程序,才会提醒安装web插件。安装完插件后,这时再点击发行-网站或H5即可打包。
打包完成后控制台会输出H5打包文件夹地址

这个web文件夹可以拷贝到任意位置,也可以随意改名称。直接双击里面的index.html是无法访问网络的。
解决方案一:搜nodejs部署静态页面或者 用nginx 或者 vscode里的live server插件(右键index.html运行)
上面相当于在自己的电脑开启服务了,或者放服务器上也可以
解决方案二:用uniCloud自带的服务空间
进入项目对应的服务空间,把文件夹上传到前端页面托管,可以托管多个文件夹即多个项目

此时进入参数配置可以查看默认域名

我们用https://默认域名/文件名/index.html即可访问项目,由于地址比较长,我们可以用草料二维码把网址转化为二维码图片。
注意默认域名访问功能是受限的,仅测试使用。如果要使用自己的域名,需购买域名,备案后再添加域名。点击添加域名会有相关指示。
三、发布APP
找到项目里的manifest.json文件,设置应用名称、图标


点击云打包(更方便快捷,无须搭建本地环境)


生成后的apk自行发送到手机安装即可运行
四、发布小程序
找到项目里的manifest.json文件,设置微信小程序AppID。

如何获得AppID?我们到微信公众平台或者微信开放平台上注册小程序账号即可,两个平台账号不互通,区别好像是后者能提供更多小程序的接口和功能。我这里只是测试,随便用,就用了前者来测试。

第三步设置小程序要用合法域名,我使用了uniCloud的服务和高德定位服务,说明链接

我们不直接点发行,因为还要调试一下,微信小程序限制了包的大小在2MB以内,而且要设置访问的合法域名。

勾选压缩文件后,点真机调试,调试通过后再点上传即可

bug:uniapp的小程序端上传不了图片,uni.chooseImage的传参小程序端有区别,修复如下:
uni.chooseImage({
success: async (res) => {
uni.showLoading({
title:"上传中,请稍后",
mask:true,
})
for(let item of res.tempFiles){
//fix bug 小程序端获取不了item.name
let suffix = item.path.substring(item.path.lastIndexOf("."))
let randomName = Date.now()+String(Math.random()).substr(3,6)+suffix
let resItem = await uniCloud.uploadFile({
filePath:item.path,
cloudPath:item.name || randomName,
})
this.editorCtx.insertImage({
src:resItem.fileID
});
}
uni.hideLoading();
}
})
上传完小程序,在微信公众平台上将小程序设为体验版即可

扫码即可体验,其它人扫码需申请管理员通过。
扩展
如果小程序真机调试时发现压缩后包的大小还是过大,可以把图片资源导出到服务器,代码引用网络资源即可。包还是过大的,可以使用分包方式处理。有需要了解分包的留言,我另写一篇。
更多推荐
所有评论(0)