12月05, 2015

我是如何搭建HyBrid App开发环境的

用web开发app简直耗尽机器的性能和人的体力、精力。 不过为了满足我的好奇心,经过一番折腾。我还是去做了。

简单来记录一下这个复杂又简单的过程。

step1

我是借助cordova来进行打包和模拟的。因此首先安装cordova,因为基于nodejs,必须安装nodejs。版本越高越好,但是一定是稳定版,beta版就算了。

npm install -g cordova

由于网络原因,安装的时候多次崩溃。但是没关系,多试几次就好。安装过程中会提示warring:它要求的nodejs版本会和你的不符合,但是没关系,这不影响开发。来几张截图。 alt

step2

安装cordova成功后,可以进入官网http://cordova.apache.org/#getstarted ,建立一个简单的模板。 alt

step3

运行:

$  cordova run browser

这个时候就可以看到你的空白的模板已经运行在浏览器上了。但是也只有一张图片而已。还没有在真实的环境中运行。

alt

step4

如果想要用模拟器对cordova进行真机模拟或者直接在手机上运行,还需要进行第5步。

step5

安装Android SDK,http://android-sdk.en.softonic.com/ 下载安装。并配置好环境变量这些东西。

step6

安装Anthttp://ant.apache.org/ ,下载安装。 Apache Ant,是一个将软件编译、测试、部署等步骤联系在一起加以自动化的一个工具,大多用于Java环境中的软件开发。 需要利用AntcordovaSDK联系在一起。不要忘记环境变量。

step7

到这一步就可以对cordova进行真机上的模拟了。 在项目中添加android运行环境。

$ cordova platform add android //1
$ cordova build android //2
$ cordova emulate android //3

但是,单纯的我以为一切都已经变得很美好了,可以结束了的时候,会发现,事情不会有那么简单。 当运行到第(2)步的时候,出现了我的android SDK版本不符合要求,要求:API 22 api22错误

于是乎,我开始对版本帝是android进行更新和下载,尽管我已经找到了代理,但是还是花费了我40多分钟的时间,安装完成了。

api下载

好了,我现在可以工作了。已经是凌晨两点钟。

当我再次运行,发现还是版本不符合要求。我受不了了。

但是还是检查了一下报错,突然发现,cordova指向的SDK并不是我刚刚安装的SDK,于是我到环境变量中查看,原来是安装Android Studio的时候,它自动配置的环境变量,在C盘的某某地方,结果就是这样。我TM刚刚更新的API是另一个SDK的。于是乎,我修改了环境变量。

step8

再次运行,还是报错,说不API版本不对。再一次,还error。再一次。。。我受不了了,简直忍无可忍。生气的我直接在Windows下的命令行输入了exit

但是睡不着。。。。于是我又重新打开命令行,最后运行了一边,竟然成功了。。。这机器没反应过来?!我只能这么解释。

由于SDK会带一个模拟器,AVD。进行模拟的时候很慢很慢,慢到难以置信,而且这个期间电脑一直没有反应,不会报错,过个五分钟,模拟器出来了。好吧。于是我想起来之前安装的Genymotion,于是直接运行:

$ cordova build android

alt

alt

cordova会在一个output文件夹下生成了一个安装包,直接拖到Genymotion中运行。(由于我是AMD的处理器,所以没有Intel的硬件支持,开发android应用的时候只能用Genymotion)。 第一次build比较慢(特别慢),第二次3s

alt

alt

最后终于ok。

step9

下一次说Ionic

本文链接:https://beacelee.com/post/build-hybridapp.html

-- EOF --

Comments

评论加载中...

注:如果长时间无法加载,请针对 disq.us | disquscdn.com | disqus.com 启用代理。