STAY HUNGRY , STAY FOOLISH.

求知若饥,虚心若愚。

       浏览:

Cordova开发环境搭建

Cordova开发环境搭建-Android

尽管Cordova可以让我们用Web技术来开发App,但是它的一些工具是需要依赖原生的SDK(Soft Development ToolKit)工具的,部署到真机测试的时候我们也需要原生的SDK工具,所以我们需要安装原生的SDK工具才能进行Cordova App的开发,尽管我们不需要写原生代码。
所以使用Cordova开发App,不管你是给哪个平台开发App,最好搭建原生的App集成开发环境(包括JDK+SDK+IDE,如:Eclipse,Xcode)。利用原生的开发环境开发Cordova,部署到真机测试也比利用Cordova命令行工具快的多,方便的多。
目前市场上面不少只是对Cordova包了一层皮,提供一站式开发,打包服务的第三方Cordova开发平台,我是不推荐使用的,不灵活,也阻碍我们对Cordova深入了解学习。

这里我先讲Mac OS上面Android开发环境的搭建。
本节包括以下几个方面内容:
安装配置JDK
安装配置adt-bundle(Android SDK+Eclipse+ADT plugin)
安装加速安卓模拟器HAXM


安装配置JDK

1.点击这里下载JDK8JDK7
2.双击下载的安装包,安装JDK;
3.配置JAVA_HOME系统环境变量,运行命令:javac -version输出类似下面的内容说明安装成功。
cordova


安装Android SDK

下面讲下adt-bundle(Android SDK+Eclipse+ADT elcipse插件集成包)的安装和配置。
1.首先下载adt-bundle;
adt-bundle下载地址:https://dl.google.com/android/adt/adt-bundle-mac-x86_64-20140702.zip(需翻墙)
2.下载完后解压即可;
3.为了让Cordova命令行工具能够工作,我们需要就爱那个sdk/tools和sdk/platform-tools追加到系统环境变量中去;
4.安装SDK更新包,除了安装基本的包外,注意要让安卓模拟器在mac上运行更快,必须安装以下东西;
cordova

cordova

5.下载完成后,找到sdk/extras/intel目录,该目录下面就是HAXM的插件,点击执行安装HAXM;
cordova

6.终于要大功告成了,建议先重启一下电脑,然后去配置AVD,注意CPU/ABI的选项;
cordova

7.启动安装模拟器,是不是打开速度变得非常快。
cordova


Cordova命令行开发工具(CLI)

Cordova命令行工具(以下简称CLI)是用来创建和初始化一个Cordova项目的,编译并将他们部署到真机或者模拟器上面。
当然你也可以只是利用Cordova命令创建初始化新的项目然后转到各自特定平台的原生集成开发环境中去开发(推荐使用这种高效率的开发方式,下面章节我会讲解)。
Cordova CLI是通过npm包(package)形式分发的,不需要从源码编译安装。

安装Cordova CLI
1.首先下载Node.js,下载后双击安装包,按照提示,一路安装即可;
2.将nodejs配置到系统环境变量中,以便在终端中可以直接运行node和npm命令,如下图所示,则配置成功;
cordova

3.使用npm命令自动化安装Cordova;

1
sudo npm install -g cordova

-g选项表示将cordova安装为全局模块,这样你在任何目录下面都能直接调用cordova命令。


Cordova开发环境搭建-IOS

上面讲解了Android开发环境的搭建,接下来将讲述IOS开发环境的搭建,苹果的大部分东西都是闭源的,就连IOS的开发环境理论都必须要用Mac OS X系统(不建议使用虚拟机,黑苹果),所以你需要:

  • 一台装有最新OS X系统的Mac电脑;
  • 一部使用IOS7.0以上的苹果设备(IPhone、ITouch、IPad);
  • 一个苹果ID账号;
  • 一个苹果开发者账号。目前最新苹果开发者账号(免费版)就可以让你的App跑到真机上面了,但是如果你要发布App到苹果应用商店,仍然需要688元每年的会员费(个人版)。

本节包括以下几个方面内容:
安装配置Xcode;
安装配置Cordova命令行工具


安装配置Xcode

打开你的Mac电脑,从App Store搜索Xcode,点击安装即可。


安装Cordova CLI

1.确认你的Mac是否已经安装了Node.js;
2.确认你的Mac是否已经使用npm命令自动化安装Cordova;
3.安装部署工具

1
2
sudo npm install -g ios-sim
sudo npm install -g ios-deploy

OK!至此Cordova开发环境搭建完成,我们可以开发Cordova App啦,在下面的”创建HelloWorld项目”一章中我会详细演示利用cordova命令和集成开发环境来开发、调试Cordova App的流程。