使用Hbuilder打包前端网站为WebApp(Android,ios应用)

准备工作:

  1. 你要打包的移动端网站地址,如:http://www.tianguixing.com/dist2/#/
  2. 安装 HbuilderX 工具: 官网:http://www.dcloud.io/

根据你的电脑系统选择下载开发版
使用Hbuilder打包前端网站为WebApp(Android,ios应用)_第1张图片
安装成功后,回到Hbuilder官网,注册一个账号,然后到软件里点击左下角头像进行登陆
使用Hbuilder打包前端网站为WebApp(Android,ios应用)_第2张图片
打开开发者工具软件,点击 文件 -> 新建 -> 项目

选择 Wap2App,填写项目名称并将刚刚复制的网址粘贴进去,模板选择默认模板,然后点击创建
使用Hbuilder打包前端网站为WebApp(Android,ios应用)_第3张图片
右下角会提示项目创建成功,此时我们点击打开 manifest.json 文件进行App配置
使用Hbuilder打包前端网站为WebApp(Android,ios应用)_第4张图片
点击 图标配置 ,上传1024px*1024px的 png格式 图片作为App图标,然后点击 自动生成所有图标并替换

使用Hbuilder打包前端网站为WebApp(Android,ios应用)_第5张图片
选择我们的项目,点击菜单栏中的 发行,选择 原生App云打包
Android勾选,ios勾选,Android设置 使用公共测试证书,点击打包
使用Hbuilder打包前端网站为WebApp(Android,ios应用)_第6张图片
IOS设置,勾选支持iPhone,支持iPad,使用越狱整数(如果选择使用IDP/IEP整数,请看如何申请证书)
使用Hbuilder打包前端网站为WebApp(Android,ios应用)_第7张图片
点击打包即可,稍等会弹出,打包成功!

结果可通过 控制台 获取:
使用Hbuilder打包前端网站为WebApp(Android,ios应用)_第8张图片

打包成功后,控制台给出下载地址
使用Hbuilder打包前端网站为WebApp(Android,ios应用)_第9张图片
点击下载地址,即可下载Android的apk应用软件,和ios的ipa应用软件(手机越狱才可安装)

你可能感兴趣的:(使用Hbuilder打包前端网站为WebApp(Android,ios应用))