• 首先我们需要用到HBuilder。 什么是HBuilder? ...HBuilder的编写用到了Java、C、Web和Ruby。HBuilder本身主体是由Java编写,它基于Eclipse,所以顺其自然地兼容了Eclipse的插件。快,是HBuilder的最大优势,通过完整...

    首先我们需要用到HBuilder。

    什么是HBuilder?

    HBuilder是DCloud(数字天堂)推出的一款支持HTML5的Web开发IDE。HBuilder的编写用到了Java、C、Web和Ruby。HBuilder本身主体是由Java编写,它基于Eclipse,所以顺其自然地兼容了Eclipse的插件。快,是HBuilder的最大优势,通过完整的语法提示和代码输入法、代码块等,大幅提升HTML、js、css的开发效率。当知道如何创建HTML5 APP项目,以及APP页面如何调试后。接下来,需要考虑的就是HTML5 APP项目打包的事情。

     

    HBuilder安装完毕后选择新建移动APP项目。

    直接把项目按文件分类拖进去。

     

    在HBuilder中创建“移动App”应用后会在工程下生成manifest.json文件,在“项目管理器”中双击即可打开

    Manifest.json文档介绍:

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

    Manifest.json文件根据w3c的webapp规范制定,plus节点下内容为HTML5Plus扩展规范,其下包括iOS和Android子节点,内容来源分别为iOS和Android原生打包所要求的参数,用于对5+移动App打包为ipa或apk安装包进行配置。

    应用信息配置:

     

    可通过点击表示设备方向的按钮来选择设备支持重力感应旋转方向。

    重力选择按钮可选择一个或多个,选择多个方向后,应用可按照指定方向显示应用页面,如只选中一个按钮,表示终端只支持一个方向显示页面内容

    应用名称:App打包后在手机上桌面的快捷方式名称;

    appid:HBuilder appid(应用标识),在创建时分配的、以后不可改的标识。如用户手动修改ID打包时会提示参数错误;

    版本号:应用的版本号

    入口页面:应用启动后自动打开的第一个HTML页面,可填写本地html文件地址(相对于应用根目录)或网络地址(以http://或https://开头)。

    debug模式:不勾选打包后的apk不生成日志文件

     

    点击“发行”-“发行为原生安装包”

    可以勾选ios和Android的安装包

    ios选项:默认选择ipone和ipad版本,选择越狱包可以不需要苹果证书,如果是需要发布到苹果商店点选使用证书,在下方ios开发者证书把相应的描述文件和私钥文件上传好。

    Android选项:如果只是打包的应用是自己用的话可以选择DCloud公用证书,如果是需要发布到线上应用商店徐点选使用自有证书,在下方的Google开发者证书把相应的证书文件、密码上传上去。

     

    图标文件和启动图片都需要png格式的图片,用户可以根据HBuilder提示添加指定尺寸的图片

    或者通过修改manifest文件修改图片的引用地址

    设置应用图标只能上传png格式的图片,可以通过上传一张192x192的源图片,可以选择自动生成所有ios和Android上不同格式的应用图标。

     

     

    点击菜单栏“运行”-“手机运行"(可以是Android手机运行,也可以是IOS手机运行)---- 前提是用数据线连接手机和电脑端。

    首次手机运行,会自动安装HBuilder APP软件(该软件用于直接打开运行的APP软件界面),下面是安装完成的效果。

    对于安桌手机,需要先把USB调试和USB安装应用选项打开,安装HBuilder APP软件后,会自动打开运行的APP软件。对于IOS手机,需要在电脑上打开itunes,通过itunes连接到手机,安装HBuilder APP软件后,需人工点击HBuilder APP软件打开运行的APP软件。

     

    其他的选择项

    ios打包ipa:iOS开发环境,Mac OS、XCode;

    Android打包apk:Android开发环境,使用eclipse和ADT;

     

    参考文献

    DCloud文档: http://ask.dcloud.net.cn/docs/#//ask.dcloud.net.cn/article/89

    5+APP开发入门指南:http://ask.dcloud.net.cn/docs/#//ask.dcloud.net.cn/article/89

     

    一些问题

    打包应用时的开发者证书怎么获取?

    参照以下链接

    http://www.cnblogs.com/vincent-guo/p/3568074.html

    http://www.cnblogs.com/franksunny/p/3938143.html

    http://www.jianshu.com/p/01e2b977f177

    对安卓各个版本和机型的兼容性

    一般可以适应安卓4.0以上

    展开全文
  • Xcode7最新版打包发布的详细步骤,方便每一位开发者。iOS开发中将工程打包成ipa文件的过程既简单又复杂,对于一个没有做过打包的人来说,生成开发者证书,描述文件的过程实在是繁琐,但是真正的操作过一次之后就会...

    Xcode7程序打包详细过程:1、用开发者账号登录开发者中心,来到这个页面,点击图中箭头指的地方:

    2、第二布来到这个页面,

    3、点击图中的加号可以创建一个新的开发者证书

    4、选取该圆圈按钮,点击下方的continue


    5、当为选择生成什么样的证书时,继续按钮是不能点击的

    6、


    7、


    8、


    9、


    10、第二步“生成appID


    11、


    12、


    13、这里不需要选择,只保持默认的就行。

    14、同样保持默认的,点击继续按钮即可


    15、


    16、


    17、


    18、


    19、



    展开全文
  • 今天装完xcode,.在装个node, ,然后在安装cordova的时候,就出现问题了,居然装不了,,window..轻轻松松就安装了,,你mac..太难用了 百度找cmd..原来mac叫终端,,哎哎,,打开终端键入命令行 $ sudo npm ...
     装虚拟机,mac网上教程很多,大伙自己搜索.. 

    今天装完xcode,.在装个node,

    ,然后在安装cordova的时候,就出现问题了,居然装不了,,window..轻轻松松就安装了,,你mac..太难用了


    百度找cmd..原来mac叫终端,,哎哎,,打开终端键入命令行

    $ sudo npm install -g cordova..

    提示要密码,,我键盘怎么输密码都没有输进去呀,,退出这个命令行,,键盘又可以用,我就纳闷,是不是在虚拟机安装mac os时,安装不完整了,导致出现某些bug..

    然后各种搜索呀,,最后,,你丫个,,安全系数也太高了吧,,,在输入密码的时候,居然是没有显示字符的,,输入完之后直接回车即可,,我是给服了..


    装完之后,,建个项目,让自己的webapp进去跑跑, 拉风拉风..


    cordova create AppV1 com.wx.v1 AppV1
    cd AppV1
    cordova platform add ios      //安卓的就是Android


     找mac硬盘下找到自己建的cordova项目,,然后在ios这个目录下下打开appv1.xcodeproj...双击..本以为可以看到xcode显示我的app了呢..

    没想到居然打不开项目,,提示权限不足,, 什么乱七八糟的,,  记得是有个提示  change permission..然后又是一番百度谷歌的,,

    还是终端,键入下面这行命令,,我是在虚拟机玩玩的,,xxx代表要提升的权限的目录,,
    sudo chmod -R 777 /Users/XXX/

    至此就可以用xcode打开cordova建的项目了.






    展开全文
  • 1.IDEA注册 http://idea.lanyus.com/  ... Activition code中输入即可 2.安装homebrew套件管理器 3.安装node.js brew install node 4.安装ionic cordova sudo npm install -g cordova ionic ...需要更换b

    1.IDEA注册 http://idea.lanyus.com/  点击获取注册码就可以了

    Activition code中输入即可

    2.安装homebrew套件管理器

    3.安装node.js  brew install node

    4.安装ionic cordova

    sudo npm install -g cordova ionic 4.1出现 需要更换brew源 4.2出现4.3查看 node_modules属主有问题执行 sudo chown hyjt:admin node_modules 然后重新安装ionic

    5.ionic info查看当前情况,然后根据提示进行安装模拟器等支持

    6.将之前写好的ionic代码放入

    www-dev为源代码 并添加resources(APP启动图标和启动图)

    7.在当前目录下执行npm install 将创建出一个node_modules文件夹

    8.执行 ionic state reset 此时会出现一个问题,无法正确生成platforms文件夹,也就是双平台工程目录

    解决方法,创建一个www文件夹,之后即可正确生成platforms文件夹

    9.此时可以运行xcworkspace工程,然后并不能正确展示

    原因为没有将工程任务集成关联在一个工程中 解决方法: gulp.js - 基于流的自动化构建工具 安装glup  首先确保你已经正确安装了nodejs环境。然后以全局方式安装gulp: sudo npm install -global gulp-cli 在目录中npm install gulp将pulp工具加入

    10.使用glup构建项目

    ios:gulp build:ios:release 安卓:gulp build:android:release(需要签名文件) 成功后重新执行 ionic state reset 终于完成了项目,此时xcode工程可以正确运行了 (实际上添加的插件,都可以在package.json文件中找到,手动添加或者修改) config.xml 配置信息 用通知广播实现ionic原生通信 添加插件cordova-plugin-broadcaster 让ionic支持cocoaPod 添加插件cordova-plugin-cocoapod-support

    展开全文
  • 因为本人的手机是IOS系统,如果用Xcode打包需要开发证书,貌似99美元一年。意外发现一个叫Hbuild的软件,简单好用,下面做个简单的使用分享:下载地址首先到网上下载一个Hbuild,->戳(windows)一、安装成功后打开...

    大家都知道H5页面怎么在手机浏览器里测试,但是如何能打包成APP测试呢?因为本人的手机是IOS系统,如果用Xcode打包需要开发证书,貌似99美元一年。意外发现一个叫Hbuild的软件,简单好用,下面做个简单的使用分享:下载地址首先到网上下载一个Hbuild,->戳(windows)

    一、安装成功后打开选择暂不登陆,进入主界面如图:

    二、把自己打好的包导入到hbuild

    三、选择对应选项及文件夹

    四、电脑连上手机,点击菜单栏“运行”–“到手机”

    五、轻松搞定,手机上出现APP

    展开全文
  • webApp打包上传到Appstore流程: 先将HTML5写好的webApp通过html5编辑器Builder打包为ipa包,打包流程下图 发行为原生安装包后如图所示: 咋们发行的是iOS版本,所以最上面一栏选者iOS,支不...
  • 首先要明白一点,打iOS 包环境:mac系统、xcode(最高支持版本7.3.1)。 装虚拟机是因为没苹果电脑或黑苹果,方便在Windows下打iOS包才装的。如果是为了本地打包服务器才装,那么也不用装,因为只需要一个名为...
  • 对应用的用户来说,他们得到的用户体验和真正的用Android Studio或者XCode开发的原生应用完全一致。 这是怎么做到的? 答案是使用Apache的开源框架,Cordova。 以Android框架为例,Cordova能将您的前端应用里...
  • 最近有小伙伴问我如何打成ipa包分发给测试人员 , 虽然现在网上的教程很多,但是也很杂, 没有一个比较完整的讲解. 利用工作之余, 就说一下如何生成ipa包?共分为两种方法. 第一种方法:  1) 至于配置发布证书和AdHoc...
  • WeX5 苹果APP打包教程

    2019-01-05 22:41:59
    WeX5是前端快速开发框架,可开发跨端运行应用,是移动App/微信/WebApp开发利器,一次开发多平台运行。因此,WeX5开发的应用,不仅可以在微信上运行,也可以直接手机浏览器运行,或者打包成App下载运行。 WeX5开发的...
  • cordova可以帮我们将一个webApp打包成安卓apk和ios的App,本文详细描述了cordova的环境搭建以及打包vue项目的webapp成手机端的App的详细过程,打包的app分为debug版本的调试版以及能上线的release版本,其中都会做...
  • 开发环境:OS X 10.11+Xcode 8.2.1+Object-C 关于如何部署苹果系统,大家可以买一台苹果电脑,或者百度黑苹果(非法不建议)。 下面是开发步骤: 1. 打开Xcode,这里用的是8.2.1,新建项目,如下图: 2. 新建...
  • Build an ionic3 web app

    2018-05-14 20:49:01
    What is ionic3 framework?The Ionic3 framework is a hybrid development framework, which is dependent on the elements, Sass, Cordova.Ionic3 development environment preparation.(Windows)1....
  • 真机调试、打包测试、发布程序常见问题(不断更新ing) 作者:XDC 原文链接:http://www.jianshu.com/p/a9f818ac1066   -----01----- 打包时出现的问题: Missing iOS Distribution signing identity for... 01...
  • Vue.js2.0作为国内热门并广为人知的前端框架,其与其他主流框架的优势在此不做过多赘述。搭建框架步骤如下:安装Node.js搭建框架需要使用最新稳定版Node.js,请选择LTS版本。tip1:如果本机有其它项目需要早期版本,...
  • webapp 的简单开发

    2019-10-06 11:47:39
    web app 的技术平台很多,如adobe phonegap、sencha touch、appcan(国产)、dcloud(国产)平台。我选择了dcloud平台,原因:简单,容易上手。 web app项目开发的技术架构:... 前端: mui(view层/control层) ......
  • webapp 网页运行在浏览器上 app 开发 native 开发 安卓 java 安卓框架 ios objective-c swift 优势 : 用户体验好 界面跳转 webview 手机原生 流畅度高 网络依赖性 不高 劣势 使用困难 (下载 100m) ...
  • 一、安装Cordova ...安装Xcode windows上运行: C:\>npm install -g cordova cordova create hello com.example.hello HelloWorld cd hello cordova platform add ios cordova platform add and...
  • 不断更新中,下面是2017-12-22更新部分 IOS_源码及视频一小部分: 开发环境:Xcode 基于cocos2d的tweejump跳跃游戏ios经典游戏源码.rar https://pan.baidu.com/share/link?uk=2433762860&shareid=2999758878
1 2 3 4 5 ... 13
收藏数 249
精华内容 99
热门标签
关键字:

xcode 打包webapp