百分百源码网-让建站变得如此简单! 登录 注册 签到领金币!

主页 | 如何升级VIP | TAG标签

当前位置: 主页>网站教程>html5教程> 运用Hbuilder打包WebApp
分享文章到:

运用Hbuilder打包WebApp

发布时间:09/01 来源:未知 浏览: 关键词:
HBuilder是DCloud(数字天堂)推出的一款支撑HTML5的Web开发IDE。该软件既可以支撑web代码编写,也可以将已经编写好的项目代码打包为手机APP。

HBuilder供给的打包有云端打包和当地打包两种,云端打包的特点是DCloud官方配置好了原生的打包环境,可以把HTML等文件编译为原生安置包。

1,下载HBuilder,注册并登陆。第一翻开“文件”-“创建”-“移动APP”,输入“利用名称”,“位置”可以按照需要本人选中即可,“选中模板”倡议选中空模板;

41.png

2,创建完成后, 在项目治理器会显示创建的项目名目,其中css,img,js和index.html这几个文件可删可改可更换。

unpackage文件夹是放置app图标和启动界面的图片。

manifest.json文件是移动App的配置文件,用于指定利用的显示名称、图标、利用入口文件地址及需要使用的设备权限等信息,会员可通过HBuilder的可视化界面视图或者源码视图来配置移动App的信息。


42.png

3,假如删除了css,img,js文件夹和index.html文件,就把其他本人的项目文件对应复制到文件夹中,留意html文件中的援用途径需要保持准确。

如下图本人拷贝的项目:

43.png

4, 文件复制完成后,刷新更新下,双击翻开manifest.json文件来配置App。


appid:点击云端猎取。版本号:按照需要来编纂。页面入口:默许是index.html,按照本人项目需要,更换APP的启动页面。利用描写:本人随意填。利用可否全屏显示:勾上就全屏显示。

44.png

5,图标准配置置:点击页面下方的图标准配置置,配置APP显示图标。

1)点击"+"号的正方形方框,选中图标素材的途径寻到图标素材,再点击" 主动生成所有图标并更换"按钮,完成图标生成和更换。

45.png

2),生成的图标主动在unpackage文件夹下

46.png

6,启动图片(splash)配置,点击切换到启动图片配置

1),启动选项:默许

2),启动图片设定,按照本人需如果Android还是iOS平台,再按照不一样设备对应做出启动图片

3),在unpackage→res文件下创建个文件命名"splash",把做好的启动图片放到这个文件里面。

47.png

4),在启动图片设定里点击"选中",寻到刚放进来的启动图片

48.png

7,SDK配置:有需要就配置,没有就默许就行。

8,模块权限配置:有需要就配置,没有就默许就行。

9,页面援用关系:

第一点击“扫描代码”,再点击左边index.html文件

该功效是啥意思:点击左侧html文件,右侧会显示不一样的文件,图片等。可以表示左侧html文件加载时所需要的资源。


49.png

10,代码视图:在代码视图里查看设定可否准确,肯定后ctrl+s留存好。

11,设定好配置选项,正式进入打包阶段

HBuilder里点:"发行"-"发行动原生安置包"开端打包

410.png

这里介绍一下iOS打包

1),这里假如选中越狱包就不需要iphone证书,一路默许设定就可以打包成功,但是打包的App只能安置在越狱过的手机,没越狱安置不了。

2),假如使用iphone证书,这里引荐一个申请iOS证书的工具 Appuploader。免iphone付费开发者账号,直接使用一般iphoneid,就能使用Appuploader申请ios测试证书,打包ipa安置到非越狱设备。

工具的安置网址:http://www.applicationloader.net/blog/zh/72.html

免开发者账号申请iOS证书教程:http://www.applicationloader.net/blog/zh/1073.html

12,提交成功后点击肯定,就可以查看App打包状态

411.png

等打包成功,就可以点手动下载,通过第三方工具 iphone助手安置到ipad上了。

412.png

13,调试和安置模拟器

假如你需要在电脑本机停止调试那就需要安置模拟器,请参照 http://ask.dcloud.net.cn/article/151怎样安置配置手机模拟器,或者在HBuilder里→→运转→→手机运转→→怎样安置配置手机模拟器进入查看。

假如需要安置到手机停止真机调试,把手机用数据线连接到电脑,然后从新启动HBuilder→→运转→→手机运转→→连接上真机。

以上就是使用Hbuilder打包WebApp的具体内容,更多请关注百分百源码网其它相关文章!

打赏

打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,你说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

百分百源码网 建议打赏1~10元,土豪随意,感谢您的阅读!

共有152人阅读,期待你的评论!发表评论
昵称: 网址: 验证码: 点击我更换图片
最新评论

本文标签

广告赞助

能出一分力是一分吧!

订阅获得更多模板

本文标签

广告赞助

订阅获得更多模板