1.uni-app项目介绍
使用uni-app开发多端项目。 一套代码可以同时打包小程序、h5、app。 uni-app 支持通过 HBuilderX 可视化界面和 vue-cli 命令行两种方式创建项目。 下面的示例项目使用 HBuilderX 可视化界面的方法创建,cli项目可以参考uni文档,大部分流程都是通用的。
项目结构:
├── common api文件 ├── components 公用组件 ├── libs 公共方法 ├── pages 页面 ├── static 本地静态资源,注意:静态资源只能存放于此 ├── store 状态管理 ├── styles 公共样式 ├── config.js 配置文件 ├── manifest.json 配置应用名称、appid、logo、版本等打包信息,详见 ├── pages.json 配置页面路由、导航条、选项卡等页面类信息 └── unpackage ├── res 图标、启动页 ├── cert APP证书文件 └── dist 打包的文件
bash复制
获取源码首先将config.js中的api请求socket地址改为自己的请求域名小程序打包网站,然后将manifest.json中各平台的appid改为自己小程序的appid:
相关开发文档:
vueuniappHBuilderXstylus
2. 注册开发者账号并创建应用
在开始开发之前,需要先去uni的开发者后台注册一个账号,登录注册地址:,然后在上面创建自己的应用程序:
3.安装开发工具HBuilderX
HBuilderX,简称HX,是一个像编辑器一样轻,像IDE一样强大的集成版本。 有点像vscode和小程序开发工具的结合体。 顶部菜单栏有“运行”和“发布”菜单。 直接点击:运行——运行到外部浏览器,可以像在浏览器中一样直接调试。
发布App时,需要使用HBuilderX。 其他开发工具不能发布App,但可以发布H5和各种小程序。 如果您需要开发应用程序,可以先在HBuilderX中运行它,然后在其他编辑器中更改并保存代码。 更改代码后,将手动同步到手机底座。 HBuilderX下载地址:。
4.创建并运行项目
首先安装一些常用的插件:
创建项目
通过HBuilderX底部菜单创建新项目:文件-新建-项目,导入现有项目:文件-导入-来自...
运行项目
通过HBuilderX的底部菜单运行项目:Run-Run to...,在开发阶段可以先选择:Run to an external browser,如果报错说缺少xx插件,就按照提示安装相应的插件,然后再次运行。
5、小程序和H5封装
各个平台的配置可以直接在manifest.json中配置小程序打包网站,也可以在HBuilderX开发工具中选择manifest.json文件,右侧会出现图形界面直接选择配置
先运行一下,然后点击:发布-小程序/网站-设置小程序/网站名/appid/域名,打包成功后,可以在dist-build文件夹中找到对应平台的打包文件(对应dist - dev 目录)是每个平台的运行文件)
6.Android应用程序打包
1.点击:发布-原生App-云打包
2、根据unpackage/cert目录下的README.md说明填写:
Android包名、证书别名、证书公钥密码、选择证书文件(直接点击浏览按钮,选择unpackage/cert目录,生成Android开发证书,参考文末说明)
3. 单击打包按钮
7.IOS应用程序打包
1.点击:发布-原生App-云打包
2、根据unpackage/cert目录下的README.md说明填写:
Bundle ID(AppID)、证书公钥密码、证书配置文件和公钥证书(直接点击浏览按钮选择unpackage/cert目录)
3. 单击打包按钮
使用云打包点击打包按钮后,需要等待一段时间,少则几分钟,多则半天……打包成功后,app安装的下载地址文件将被复制到控制台上:
Android:apk文件,直接点击“打开目录”,生成的apk文件在unpackage/release/apk文件夹中
IOS:ipa文件,直接点击“下载地址”远程下载到本地
包装证书相关信息:
Android平台云打包证书使用说明
Android平台云打包-DCloud公共证书(DCloud旧版证书)
Android平台签名证书(.keystore)生成手册
iOS证书(.p12)和描述文件(.mobileprovision)申请
8.发布并上线
1、小程序
直接使用小程序开发者工具导出dist-build文件夹下对应目录,如Momo小程序:dist/build/mp-weixin
2、H5
像网站一样,在线部署最终打包的H5文件:dist/build/h5
3.安卓
4.IOS
① 正式版
ios即将推出的应用程序只能从应用程序商店下载。 您需要先注册苹果开发者账号,填写各种申请信息,上传ipa文件并通过初审后才能下载使用。
② 测试版
测试ios-app时,将ipa文件上传到Dandelion:
使用授权苹果手机扫描二维码并在Safari浏览器中打开直接下载安装,或直接在Safari浏览器中输入“下载地址”
附件:windows下生成Android开发证书
Android平台打包发布apk应用程序,需要使用数字证书(.keystore文件)进行签名,以表明开发者的身份。 Android证书的生成是自助、免费的,不需要审批或付费。
可以在JRE环境下使用keytool命令生成。 以下是windows平台生成证书的方式:
1.安装JRE环境
可以从Oracle官方下载jre安装包:(记住安装路径,后面生成证书时会用到)
2.打开命令行(cmd),可以先切换到要生成的目录
我直接在盘符根目录生成输入:
d:
bash复制
3、将JRE安装路径添加到系统环境变量中
我的JRE安装在盘符“D:Programsjrebin”下
set PATH=%PATH%;"D:Programsjrebin"
bash复制
注意这里的安装路径不要写错。 我一开始在路径的Programs中丢了一个s,后来总是报错:keytool不是内部或外部命令,也不是可运行的程序。
4、使用keytool -genkey命令生成证书
keytool -genkey -alias testalias -keyalg RSA -keysize 2048 -validity 36500 -keystore android.keystore
bash复制
根据提示输入信息后,会在盘符根目录下生成android.keystore文件,使用该文件可以直接打包Android应用
小程序注册流程
1. 报名方式
在陌陌官网(mp.weixin.qq.com)首页网站程序种类有,点击右上角“立即注册”按钮。
2.选择注册账户类型
选择“小程序”,点击“查看类型差异”,即可查看不同类型账户的差异和优势。
3.填写邮箱地址和密码
请填写未在公众平台、开放平台、企业账户或未绑定个人账户注册的邮箱地址。
4. 激活电子邮件
登录您的邮箱,查看激活邮件,然后点击激活链接。
5.填写主题信息
单击激活链接后,继续注册过程的下一步。 请选择主题类型以创建主题信息和管理员信息。
选择主题类型:
主要类型描述如下:
注册选择类型
组织类型
个人的
18岁以上拥有中国大陆公民身份信息的陌陌实名用户
企业类型
个人独资企业、企业法人、非法人企业、非法人企业法人、全称所有制、农民专业合作社、企业分支机构、合伙企业、其他个体工商户、个体工商户、个体户
媒体类型
事业单位媒体、其他媒体、电视广播、报纸、杂志、网络媒体等
其他组织
非营利组织(基金会、政府机构驻外代表处)
社会团体(社会团体法人、社会团体分支机构、代表机构、其他社会团体、群众团体)
公办非企业、中学、诊所等
其他组织(宗教活动场所、农村居民委员会、城镇居民委员会、自定义区域、未列出的其他组织)
政府
事业单位(事业单位法人、事业单位分支机构、派出机构、军事诊所、国家权力机关法人、其他事业单位)
政府机关(国家行政机关法人、民主党派、政协组织、解放军、武警部队、其他机关)
填写主体信息并选择验证方式
企业账户的验证方法主要有两种。
表格 1:付款验证
需使用公司公众账号向腾讯汇款,验证主体身份,提交主体信息后即可查看支付信息。
请按照页面提示将指定金额汇至指定收款账户。
温馨提示:请在10天内完成转账,否则注册失败。
方法二:Momo认证
通过陌陌认证验证主体身份,需缴纳300元验证费。 在认证通过之前网站程序种类有,小程序的部分功能暂时无法使用。
如果您想了解主体验证方法,请“点击此处”
填写管理员信息
确认主体信息不可更改